patternjavascriptMinor
My Google Maps Script
Viewed 0 times
scriptmapsgoogle
Problem
I've written a script with the Google Maps JavaScript API v3.
I've ran it through JSHint and everything seems to be valid.
I'm wondering if my script has room for improvement.
Any suggestions are very much welcome!
```
(function () {
'use strict';
var map,
markers = [];
function initMap() {
var paris = new google.maps.LatLng(48.856614, 2.3522219000000177),
options = {
// required
center: paris,
zoom: 10,
// disable all user interaction
disableDefaultUI: true,
navigationControl: false,
mapTypeControl: false,
scaleControl: false,
scrollwheel: false,
draggable: false,
zoomControl: false,
disableDoubleClickZoom: true
};
map = new google.maps.Map(document.getElementById('map'), options);
addMarker(paris, false);
// center map responsively
google.maps.event.addDomListener(window, 'resize', function () {
var center = map.getCenter();
google.maps.event.trigger(map, 'resize');
map.setCenter(center);
});
}
function geocodeAddress() {
var geocoder = new google.maps.Geocoder(),
addressInp = document.getElementById('address-inp');
geocoder.geocode({ 'address': addressInp.value }, function (results, status) {
if (status !== google.maps.GeocoderStatus.OK) {
alert('Geocode was not successful for the following reason: ' + status);
return;
}
map.fitBounds(results[0].geometry.viewport);
map.setCenter(results[0].geometry.location);
deleteAllMarkers();
addMarker(results[0].geometry.location, true);
addressInp.value = results[0].formatted_address;
});
}
function addMarker(location, animateDr
I've ran it through JSHint and everything seems to be valid.
I'm wondering if my script has room for improvement.
Any suggestions are very much welcome!
```
(function () {
'use strict';
var map,
markers = [];
function initMap() {
var paris = new google.maps.LatLng(48.856614, 2.3522219000000177),
options = {
// required
center: paris,
zoom: 10,
// disable all user interaction
disableDefaultUI: true,
navigationControl: false,
mapTypeControl: false,
scaleControl: false,
scrollwheel: false,
draggable: false,
zoomControl: false,
disableDoubleClickZoom: true
};
map = new google.maps.Map(document.getElementById('map'), options);
addMarker(paris, false);
// center map responsively
google.maps.event.addDomListener(window, 'resize', function () {
var center = map.getCenter();
google.maps.event.trigger(map, 'resize');
map.setCenter(center);
});
}
function geocodeAddress() {
var geocoder = new google.maps.Geocoder(),
addressInp = document.getElementById('address-inp');
geocoder.geocode({ 'address': addressInp.value }, function (results, status) {
if (status !== google.maps.GeocoderStatus.OK) {
alert('Geocode was not successful for the following reason: ' + status);
return;
}
map.fitBounds(results[0].geometry.viewport);
map.setCenter(results[0].geometry.location);
deleteAllMarkers();
addMarker(results[0].geometry.location, true);
addressInp.value = results[0].formatted_address;
});
}
function addMarker(location, animateDr
Solution
Your
The reason is is more philosophical than practical. You're trying to use Google maps' api to initialize your maps objects. It seems un-intuitive that Maps should initialize maps.
If Google ever changed their API for their DOM listener, it could mess up this functionality.
The only other issue I would consider is some protection against the
initMap function is called by the Google Maps' DOM listener. I would actually move this to the anonymous window.onload function that you have.The reason is is more philosophical than practical. You're trying to use Google maps' api to initialize your maps objects. It seems un-intuitive that Maps should initialize maps.
If Google ever changed their API for their DOM listener, it could mess up this functionality.
The only other issue I would consider is some protection against the
initMap being called twice. Just a flag at the top or something simple like that:if (mapsInitialized)
return;
mapsInitialized = true;Code Snippets
if (mapsInitialized)
return;
mapsInitialized = true;Context
StackExchange Code Review Q#73841, answer score: 6
Revisions (0)
No revisions yet.