| jQuery('#datasets').on('click', '.toggle_visualizations', function () { | |
| var thischeckbox = jQuery(this); | |
| var ladata = thischeckbox.data(); | |
| var id_dataset = ladata.id_dataset; | |
| var category = ladata.category; | |
| globalmap[category] = globalmap[category] || {}; | |
| var DataSet = globalmap[category][id_dataset]; | |
| ladata.flag = thischeckbox.is(':checked'); | |
| DataSet.setOptions({ | |
| visible: ladata.flag |
| jQuery('#datasets').on('click', '.toggle_visualizations', function () { | |
| var thischeckbox = jQuery(this); | |
| var ladata = thischeckbox.data(); | |
| ladata.flag = thischeckbox.is(':checked'); | |
| DataSet.saveSetting({ | |
| visible: ladata.flag | |
| }); | |
| Intercom('trackEvent', 'updateVisibility', ladata); | |
| instaGIS.updateVisibility(ladata); | |
| }); |
| jQuery('#datasets').on('click', '.toggle_visualizations', function () { | |
| var thischeckbox = jQuery(this); | |
| var ladata = thischeckbox.data(); | |
| ladata.flag = thischeckbox.is(':checked'); | |
| DataSet.saveSetting({ | |
| visible: ladata.flag | |
| }); | |
| instaGIS.trackEvent('updateVisibility', ladata, true); | |
| }); |
| globalmap.conn.on('trackedEvent', function (thisEvent) { | |
| var ladata = thisEvent.event_details; | |
| switch (thisEvent.event_name) { | |
| case 'updateVisibility': | |
| instaGIS.updateVisibility(ladata); | |
| break; | |
| } | |
| }); |
This example shows the county boundaries for Illinois. In red we see the google.maps.Data() layer in blue a D3.geo.path() with mercator projection.
The google data layer is an object which displays in the same canvas as any google overlay (polygons, markers, polylines, etc) while the D3.geo.path() shows up in an SVG container I overlap on top of the google container.
This example shows the county boundaries for Illinois. In red we see the google.maps.Data() layer in blue a D3.geo.path() with mercator projection.
The google data layer is an object which displays in the same canvas as any google overlay (polygons, markers, polylines, etc) while the D3.geo.path() shows up in an SVG container I overlap on top of the google container.
Example: getting the user position with HTML5 Geolocation API, then using google maps to find a route to the desired clicked location.
Example:
Using a JS object to draw a collection of markers, taking the position and additional attributes from the object itself.
On each loop the marker is drawn, and it receives a click listener, which in turn opens an infowindow whose content is the markers properties, taken from the JS object.
Made as an example for Stack Overflow
Unoptimized markers exist as img elements inside the markerLayer mapPane.
(If your markers didn't had the optimized:false property, they will render inside a canvas element and won't be CCS stylable)
To get a reference to the markerLayer mapPane
var myoverlay = new google.maps.OverlayView();
myoverlay.draw = function () {
//this assigns an id to the markerlayer Pane, so it can be referenced by CSS
| <html> | |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> | |
| <script> | |
| function removeFile() | |
| { | |
| var input = document.getElementById("fileToUpload"); | |
| input.value = input.defaultValue; | |
| refreshForm(); | |
| return false; |