javascript - Bulk uploading markers from Excel with custom info boxes -

-

i'm trying upload excel spreadsheet containing student names geolocations, , "top skills" online class google javascript api.

eventually, want each location have popup box associated it, displaying student name , top skills.

from can tell according api, have use data arrays plot markers:

var locations = [   ['bondi beach', -33.890542, 151.274856, 4],   ['coogee beach', -33.923036, 151.259052, 5],   ['cronulla beach', -34.028249, 151.157507, 3],   ['manly beach', -33.80010128657071, 151.28747820854187, 2],   ['maroubra beach', -33.950198, 151.259302, 1] ];

then add these locations this:

for (i = 0; < locations.length; i++) {         marker = new google.maps.marker({         position: new google.maps.latlng(locations[i][1], locations[i][2]),         map: map       });     }

a couple of questions:

  1. is there speedier way of uploading excel spreadsheet data javascript format without manually writing each location?
  2. how associate specific locations student name , list of skills?

you use json this. if save excel file .csv there online converters can change json. in past i've done on project:

http://burdsgis.coffeecup.com/blueplaques/bpwords.html

the json above looks this:

var dec_markers = [  {     "newnumber": "1",     "title": "97",     "location": "unknown",     "unveiler": "unknown",     "date": "unknown",     "sponsor": "unknown",     "tomeast": "-1.55167",     "tomnorth": "53.7917",     "title2": "97",     "tomurl": "http://farm1.staticflickr.com/76/198148805_85d6ff5b44_m.jpg",     "tomlink": "http://www.flickr.com/photos/44067831@n00/198148805/in/set-1439239/" },

etc...

you can call json in map.js:

        //for loop run through marker data     (id in dec_markers) {          var photo = '<a href="' + dec_markers[id].tomlink + '" target="_blank" title="' + dec_markers[id].title +' tom.smith, on flickr"><img src="' + dec_markers[id].tomurl + '" alt="' + dec_markers[id].title2 + '"></a>';          var info =  '<div><h1>' + dec_markers[id].title + '</h1><p><b>date unveiled: </b>'  + dec_markers[id].date + "<br><b>sponsor: </b>" + dec_markers[id].sponsor + '</p>' + photo + '</div>';          var latlng = new google.maps.latlng(dec_markers[id].tomnorth,dec_markers[id].tomeast);          addmarker(latlng,dec_markers[id].title,info);          mc.addmarker(marker);         }

i scraping images flickr album populate pop boxes (using flickr api).

google csv json converter. i'd suggest using infobubble rather infowindow former more versatile. clustering effect can use markerclustererplus google maps v3


Comments

Post a Comment

Popular posts from this blog

html - Styling progress bar with inline style -

-
i trying set progress bar color red using inline style. need in way because have access <body> part of document. style need apply: progress { color: red } progress::-moz-progress-bar { background: red;} progress::-webkit-progress-value { background: red; } progress[aria-valuenow]:before { background: red; } i tried <progress style="background: red;"> incorrect effect, progress bar color turns blue red background. guide right direction desired style? thank in advance. here live example: https://jsfiddle.net/z36d3f6l/
Read more

java - Oracle Sql developer error: could not install some modules -

-
i have downloaded fresh copy of sqldeveloper ( sqldeveloper-4.1.3.20.78-no-jre ) oracle website. when unzip , lauch gui, keep getting following error message: warning - not install modules: dynamic module config - no module providing capability org.netbeans.netbinox found. my system: windows 7 32 bit hp probook. jdk 1.6 , 1.7, 1.8 available in java/jdk subdirectory. netbeans 8.0.2 installed finally got way out after dirty hours. extracted sqldeveloper zip in nested directory. i.e: e://a/b/c/sqldeveloper. starting sqldeveloper gui above directory threw erros. solution: go in c:\users**username**\appdata\roaming : delete sql developer , sqldeveloper folders extract sql developer zip in new non nested directory. i.e: e:// start , should work now reference: https://community.oracle.com/thread/3870680?start=0&tstart=0
Read more

How to use autoclose brackets in Jupyter notebook? -

-
this may sound silly question, how make use of autoclose brackets in jupyter notebook? example, when type print( jupyter notebook auto-closes brakets print() and places cursor inside. type argument, say print(1 + 1) now cursor between second 1 , right bracket ) . key navigate right of ) ? of course can press end or → or ) achieve this, not seem save time, purpose of brackets autoclose suppose? thanks in advance.
Read more