JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>
<select id="floorplans" style="margin:6px;">
<option value="http://i.imgur.com/Nc9Bkb5.jpg|42.329860423994724,-83.05587045417138|42.329966013551484,-83.05561765597173|42.32965668026449,-83.05538229213067">Floorplan #1</option>
<option value="http://i.imgur.com/vSQJv0n.jpg|42.32794639665462,-83.05126845405408|42.3282735849422,-83.05150985286542|42.32875048361034,-83.05040679440805|400|300">Floorplan #2</option>
</select>
<div id="map_canvas"></div>
CSS
html,body,#map_canvas{height:100%;margin:0;padding:0}
#map_canvas{
height:100%;
}
JavaScript
/*--------------------
Geo+LatLon-libraries
--------------------*/
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* Latitude/longitude spherical geodesy formulae & scripts (c) Chris Veness 2002-2014 */
/* - www.movable-type.co.uk/scripts/latlong.html MIT Licence */
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* jshint node:true *//* global define */
'use strict';
if (typeof module!='undefined' && module.exports) var Geo = require('./geo'); // CommonJS (Node.js)
/**
* Creates a LatLon point on the earth's surface at the specified latitude / longitude.
*
* @classdesc Tools for geodetic calculations
* @requires Geo
*
* @constructor
* @param {number} lat - Latitude in degrees.
* @param {number} lon - Longitude in degrees.
* @param {number} [height=0] - Height above mean-sea-level in kilometres.
* @param {number} [radius=6371] - (Mean) radius of earth in kilometres.
*
* @example
* var p1 = new LatLon(52.205, 0.119);
*/
function LatLon(lat, lon, height, radius) {
// allow instantiation without 'new'
if (!(this instanceof LatLon)) return new LatLon(lat, lon, height, radius);
if (typeof height == 'undefined') height = 0;
if (typeof radius == 'undefined') radius = 6371;
radius = Math.min(Math.max(radius, 6353), 6384);
this.lat = Number(lat);
this.lon = Number(lon);
this.height = Number(height);
this.radius = Number(radius);
}
/**
* Returns the distance from 'this' point to destination point (using haversine formula).
*
* @param {LatLon} point - Latitude/longitude of destination point.
* @returns {number} Distance between this point and destination point, in km (on sphere of 'this' radius).
*
* @example
* var p1 = new LatLon(52.205, 0.119), p2 = new LatLon(48.857, 2.351);
* var d = p1.distanceTo(p2); // d.toPrecision(4): 404.3
...