Ik maak een eenvoudige app om een leaflet-kaart te tonen met meteor. Maar het werkt niet. Dit is mijn code : Html:
<div id="viewDiv"> Explore D3 </div> </template> javascript:
onRendered(){ L = require('esri-leaflet') var map = L.map('viewDiv').setView([45.528, -122.680], 13); L.esri.basemapLayer("Gray").addTo(map); var parks = L.esri.featureLayer({ url: "http://gis.d3smartcity.ae/arcgis/rest/services/Operation_layers/d3_Masterplan/MapServer?f=jsapi", style: function () { return { color: "#70ca49", weight: 2 }; } }).addTo(map); var popupTemplate = "<h3>{NAME}</h3>{ACRES} Acres<br><small>Property ID: {PROPERTYID}<small>"; parks.bindPopup(function (e) { return L.Util.template(popupTemplate, e.feature.properties) }); }
Dadi,
One major issue is the url you are using for the featureLayer:
<SPAN class="keyword token">var</SPAN> parks <SPAN class="operator token">=</SPAN> L<SPAN class="punctuation token">.</SPAN>esri<SPAN class="punctuation token">.</SPAN><SPAN class="token function">featureLayer</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">{</SPAN> url<SPAN class="punctuation token">:</SPAN> <SPAN class="string token"><SPAN>"</SPAN><A class="jive-link-external-small" href="https://community.esri.com/external-link.jspa?url=http%3A%2F%2Fgis.d3smartcity.ae%2Farcgis%2Frest%2Fservices%2FOperation_layers%2Fd3_Masterplan%2FMapServer%3Ff%3Djsapi" target="_blank">http://gis.d3smartcity.ae/arcgis/rest/services/Operation_layers/d3_Masterplan/MapServer?f=jsapi</A><SPAN>"</SPAN></SPAN><SPAN class="punctuation token">,</SPAN> style<SPAN class="punctuation token">:</SPAN> <SPAN class="keyword token">function</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN> <SPAN class="keyword token">return</SPAN> <SPAN class="punctuation token">{</SPAN> color<SPAN class="punctuation token">:</SPAN> <SPAN class="string token">"#70ca49"</SPAN><SPAN class="punctuation token">,</SPAN> weight<SPAN class="punctuation token">:</SPAN> <SPAN class="number token">2</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">;</SPAN> <SPAN class="punctuation token">}</SPAN> <SPAN class="punctuation token">}</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">addTo</SPAN><SPAN class="punctuation token">(</SPAN>map<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
it should be (no ?f=jsapi):
var parks = L.esri.featureLayer({ url: "http://gis.d3smartcity.ae/arcgis/rest/services/Operation_layers/d3_Masterplan/MapServer", style: function () { return { color: "#70ca49", weight: 2 }; } }).addTo(map);<SPAN class="line-numbers-rows"><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN><SPAN></SPAN></SPAN>
thanks, but I still having this type of error :
Ps : I'm using the npm package "esri-leaflet"
This is a bit out of my comfort zone, as I don't work with Meteor or NPM leaflet package.
I am going to tag the Leaflet group maybe someone there can help.
https://community.esri.com/groups/esri-leaflet?sr=search&searchId=c21df669-81e0-469d-a237-097962db585d&searchIndex=0
Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.