/*global google, ko*/ /*jshint esversion: 6 */ /* jshint -W031 */ (function (ns){ "use strict"; var mapOptions, mapCanvas, map, gpsViewModel; mapOptions = { zoom: 6, center: { lat: -34.397, lng: 150.644}, mapTypeId: google.maps.MapTypeId.ROADMAP }; mapCanvas = document.getElementById('map-canvas'); if (!map) { map = new google.maps.Map(mapCanvas, mapOptions); gpsViewModel = new ns.GpsViewModel(); ko.applyBindings(gpsViewModel); google.maps.event.addListener(map, 'click', function (evemt) { new google.maps.Circle({ strokeColor: "#FF0000", strokeOpacity: 0.8, strokeWeight: 2, fillColor: "#FF0000", fillOpacity: 0.35, map, center: { lat: gpsViewModel.lat(), lng: gpsViewModel.lng()}, radius: Math.sqrt(603502) * 100 }); }); google.maps.event.addListener(map, 'mousemove', function (event) { gpsViewModel.lat(event.latLng.lat()); gpsViewModel.lng(event.latLng.lng()); }); } }(window.milosev));gps.js:
/*global window, ko*/ (function (ns) { "use strict"; var self; ns.GpsViewModel = function () { self = this; self.lat = ko.observable(); self.lng = ko.observable(); return { lat: self.lat, lng: self.lng }; }; }(window.milosev));Notice line:
radius: Math.sqrt(603502) * 100
That was just copy / paste, otherwise radius is in meters Source download from here. Live example:
Langitude:
Longitude: