Google Maps Circle - javascript - Stack Overflow

文章推薦指數: 80 %
投票人數:10人

If you want to add Circles instead of markers, you can use your $.each loop and simply check the location block before adding a point. Here is a ... Resultsfromthe2022DeveloperSurveyarehere. Home Public Questions Tags Users Companies Collectives ExploreCollectives Teams StackOverflowforTeams –Startcollaboratingandsharingorganizationalknowledge. CreateafreeTeam WhyTeams? Teams CreatefreeTeam Collectives™onStackOverflow Findcentralized,trustedcontentandcollaboratearoundthetechnologiesyouusemost. Learnmore Teams Q&Aforwork Connectandshareknowledgewithinasinglelocationthatisstructuredandeasytosearch. Learnmore GoogleMapsCircle AskQuestion Asked 6years,7monthsago Modified 3years,10monthsago Viewed 8ktimes 0 IamtryingtoloaddatafromanAPIthendisplayitusingcircles.Iamabletocreatemarkerswiththedatapointsbutnotcircles.IamfollowingthisexampleherefromGoogle'sdocumentation. WhatIexpecttohappenisintheforloop,usingcenter:newgoogle.maps.LatLng(well.location.latitude,well.location.longitude)wouldsufficetocreatethecenterpoints.However,thatdoesn'tseemtowork.Everythingelseisthesameastheexample(willmodifylater). Iexpectedthistoworkbecauseearlierintheexample,Iamabletouse$.eachtodisplaymarkersusingfield.location.latitude,field.location.longitudewhichisessentiallythesamething(orsoIthink). CanInotmakecircleswithinthe$.getJSONfunctionlikeIcanwithmarkers?Isithappening"outofsync"?I'mstilltryingtolearnhowtoprocessasyncevents. Fiddlehere. HTML:

CSS: #map{ border:1pxsolidblack; margin:0auto; width:500px; height:300px; } JavaScript varmap; varmapProp; varurl; varmarker; varmarkers=[]; varinfoWindow; varwellCircle; functioninitMap(){ mapProp={ center:newgoogle.maps.LatLng(39.0,-105.782067), zoom:6, mapTypeId:google.maps.MapTypeId.TERRAIN }; map=newgoogle.maps.Map(document.getElementById("map"),mapProp); infoWindow=newgoogle.maps.InfoWindow({ content:"helloworld" }); }; functionaddMarker(lat,lng){ marker=newgoogle.maps.Marker({ position:newgoogle.maps.LatLng(lat,lng), map:map }); markers.push(marker); //console.log(markers); }; $(document).ready(function(){ url='https://data.colorado.gov/resource/hfwh-wsgi.json?&$limit=500'; initMap(); $.getJSON(url,function(data){ //console.log(data); for(vari=0;i Share Improvethisanswer Follow editedAug3,2018at20:48 answeredNov25,2015at14:34 geocodezipgeocodezip 154k1313goldbadges208208silverbadges238238bronzebadges 0 Addacomment  |  1 Yourcodeforthemarkerswascorrect,buttherearesomeitemsofyourdatathatdonothavealocationproperty,that'swhyyourcodeisnotfullyworking. IfyouwanttoaddCirclesinsteadofmarkers,youcanuseyour$.eachloopandsimplycheckthelocationblockbeforeaddingapoint. Hereisaworkingexample:http://jsfiddle.net/xb7eh58p/(sorry,didn'tuseyoursbecauseIhadnotseenyourlink) Indetails,hereisyourcodethatIadjusted: varmap; varmapProp; varurl; varmarker; varmarkers=[]; varinfoWindow; varwellCircle; functioninitMap(){ mapProp={ center:newgoogle.maps.LatLng(39.0,-105.782067), zoom:6, mapTypeId:google.maps.MapTypeId.TERRAIN }; map=newgoogle.maps.Map(document.getElementById("map"),mapProp); infoWindow=newgoogle.maps.InfoWindow({ content:"helloworld" }); }; functionaddMarker(lat,lng){ marker=newgoogle.maps.Marker({ position:newgoogle.maps.LatLng(lat,lng), map:map }); markers.push(marker); }; $(document).ready(function(){ url='https://data.colorado.gov/resource/hfwh-wsgi.json?&$limit=500'; initMap(); $.getJSON(url,function(data){ //console.log(data); //for(vari=0;i


請為這篇文章評分?