esri / esri-leaflet Goto Github PK

the README currently states that DynamicMapLayers must come from a service published in Web Mercator but they actually draw quite well no matter what the projection of the original service (because we ask for a reprojected tile).

http://gravois/leaflet/dynamicReprojected.html

Am i missing the reason for discouraging this (besides the performance hit?)

If we want to publicize support, I am happy to write up a simple sample demonstrating that its possible.

In the interest of keeping this simple I want to impliment this as follows.

L.featureLayer(url, {
  token: "AN_ACCESS_TOKEN"
})

This will set this.options.token on the object. Then whenever a request is made to the service that token should be added to the request params.

This approach will keep the code lightweight, simple and clear and allow developers to pick an choose their authentication mechanism. The disadvantage is that it will be more work for developers as we will not handle token generation or error handling when a token expires.

The alignment is off because of overflow: hidden; and with no text-shadow support they tend to disappear into the background.

map.removeLayer(fl); doesn't remove cluster markers. Simple work-around is to delete it manually.

map.removeLayer(fl.cluster);
map.removeLayer(fl);

Soon Terraformer will be a stable 1.0 Esri/terraformer#138 and all its components will be broken out into separate repositories.

This means we will have to change the project structure to accommodate Terraformer, Terraformer ArcGIS and Terraformer RTree as separate submodules and/or bower components.

This is the street network that overlays on top of the imagery basemap.

http://www.arcgis.com/home/item.html?id=94f838a535334cf1aa061846514b77c7

https://github.com/Leaflet/Leaflet/blob/master/PLUGIN-GUIDE.md

Mark Wells from Esri UK has noticed that points on this service (http://services.arcgis.com/Qo2anKIAMzIEkIJB/arcgis/rest/services/Leaflet/FeatureServer/0) occasionally disappear at certain zoom levels. This might be related to the RTree not thinking they are in bounds and hiding them.

Hi,

Is there any possibility to use L.esri.TiledMapLayer with MapServices that not be published in Web Mercator, for example:
http://mapy.geoportal.gov.pl/wss/service/imgurl/guest/TOPO/MapServer
?

Best regards
Krzysztof

@swingley told me that the ArcGIS Javascript API simply sets something like display:none; or visibility:hidden; to hide features that are outside the map view on FeatureLayer.

Currently we are removing features when they move out fo the map viewport and adding the same object back in when it renters.

We should look at the performance differences of each.

This issue collects ideas for improving the performance of L.esri.FeatureLayer.

• #12 Gridded queries for FeatureLayer
• #14 Investigate performance difference of hiding feature vs removing them.
• #13 Simplify polygons and polylines based on zoom.
• #15 Option to run the processing code in a web worker for extra performance

Many ideas were inspired by https://speakerdeck.com/mourner/high-performance-data-visualizations and conversations with @swingley on the ArcGIS Javascript API

The WebMap JSON specification provides a simple way to encapsulate a list of layers, map styling, basemap, and bookmarks.

It would be useful to provide support for loading any WebMap JSON into leaflet, and also encourage other tools to consume and publish WebMaps.

This is used in L.esri.FeatureLayer and will break in IE8.

Most of the classes have very little testing. This issue is a reminder that we need solid coverage and testing going forward before a final release.

I added 10 Dynamic Layers to a layer control (as overlays) with each layer turned off initially. If I don't pan the map when I first open it, turn on a layer, it's displayed correctly. However, if I open the map page, pan the basemap, then turn on a dynamic layer, the points/polygons are shifted over to the left. Panning/zooming snaps the layer back into the correct place.

If I then turn off the layer, then pan, turn the layer back on, it displays correctly. So it appears to only occur the first time.

Seems like all the Feature Services endpoints need a different token.

For instance this demo shows no data: http://esri.github.io/esri-leaflet/demo/symbolizepointfeatures.html

And the query to FeatureService return invalid token: http://services.arcgis.com/rOo16HdIMeOBI4Mb/arcgis/rest/services/stops/FeatureServer/0/query?geometryType=esriGeometryEnvelope&geometry=%7B%22xmin%22%3A-122.69514083862303%2C%22ymin%22%3A45.508602583745606%2C%22xmax%22%3A-122.6483631134033%2C%22ymax%22%3A45.54639437243515%2C%22spatialReference%22%3A%7B%22wkid%22%3A4326%7D%7D&outFields=*&outSr=4326&f=json&callback=L.esri._callbacks%5B'callback_c8lube.b4x8fv9rudi'%5D

Both dynamic map service demos control menus don't expand/collapse properly.

It looks like if you pan/zoom in quick succession you can make a DynamicMapLayer "misalign" for a second until it finishes loading and then it snaps back into the proper place.

This is noiciable a bit in the demo at http://esri.github.io/esri-leaflet/dynamicmapservice.html.

However in this demo its much more visible http://wboykinm.github.io/geosprocket-labs/esri/dynmapservice-bug.html.

http://www.arcgis.com/home/item.html?id=9c5370d0b54f4de1b48a3792d7377ff2

I'm able to successfully execute your example, but when our internal services are queried I'm getting: 'error: "Could not parse response as JSON."'

jen.dyn = L.esri.dynamicMapLayer('my/internal/address/goes/here',{
    opacity: 0.5,
    layers: [0]
});
jen.map.addLayer(jen.dyn);

jen.map.on('click', function(e) {
    jen.dyn.identify(e.latlng, function(data) {
        if (data.results.length > 0) {
            var popupText = '<center><b>' + data.results[0].Layer + '</b><br>' + data.results[0].attributes.DOTNUM + '</center>';
            var popup = L.popup()
                .setLatLng(e.latlng)
                .setContent(popupText)
                .openOn(jen.map);
        }
    });
});

On a Tile Layer, you should not be requesting tiles outside of the zoom level. otherwise 404's.

@alaframboise I'll do this one.

Should work on the 0.5.x branch and the 0.6.x branch. Dynamic Map Layer is affected by a bug in Leaflet 0.6.1 and 0.6.2.

Currently there is a lot of processing code that needs to happen before we know which features to show and hide on a map.

We could get a performance boost (and not lock the UI thread) by giving people the options to move this into a web worker.

We should build a new L.esri.TiledMapLayer class which would map roughly to https://developers.arcgis.com/en/javascript/jsapi/arcgistiledmapservicelayer.html

This class should also have an identify method to support the method on the Map Service.

While using the layers control for an Esri ClusteredFeatureLayer there seems to be an issue with toggling visibility.

I add the layer to the layers control, when I click the check box to make layer visible, layer becomes visible. When I unchecked the box, layer stayed visible.

Some tile servers do support the identify method. We should just move the identify method to a mixin L.esri.Mixins.Identify and include it in L.esri.TiledMapLayer and L.esri.DynamicMapLayer.

@alaframboise can you give me an example of a tiled map server that supports identify?

SuperArrayIndex https://github.com/JerrySievert/Terraformer/blob/osbridge/examples/osbridge-presentation/superArrayIndex.js and RBush https://github.com/mourner/rbush both come to mind.

Here is a quick timeline comparisons.

In the ArcGIS Javascript API when a FeatureLayer is in on demand mode queries are made against a grid that is independent of the map view so calls to the service get cached (403).

We should do something similar for L.esri.FeatureLayer if we get a 403 response we can simply ignore all the features in that call (since that means there was already a request made for that grid square) which will also cut down on processing time.

Right now this works with ArcGIS services but as a matter of best practice we shouldn't use quotes in the callback param for L.esri.get

http://tav.espians.com/sanitising-jsonp-callback-identifiers-for-security.html

We shoudl support a L.esri.DynamicMapLayer class that maps roughly to https://developers.arcgis.com/en/javascript/jsapi/arcgisdynamicmapservicelayer.html
in the official Javascript API.

Like in #16 this should also support identify

To reproduce the issue add a basemap layer, dynamic layer and a geoJson layer on top. On load it all renders in correct order, after panning or zooming the dynamic layer renders over the geoJson layer. So the layer order is switched.

code to reproduce...

    var map = L.map('map').setView([41.00 ,- 109.05], 5);
    L.esri.basemapLayer("Gray").addTo(map);

    L.esri.dynamicMapLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer", {
        layers: [5, 4, 3]
    }).addTo(map);

    var states = [{
        "type": "Feature",
        "properties": { "party": "Democrat" },
        "geometry": {
            "type": "Polygon",
            "coordinates": [[
                [-109.05, 41.00],
                [-80, 40.99],
                [-80, 36.99],
                [-109.04, 36.99],
                [-109.05, 41.00]
            ]]
        }
    }];

    L.geoJson(states, {
        style: function (feature) {
            switch (feature.properties.party) {
                case 'Republican': return { color: "red", opacity: 1, fillColor: "red" };
                case 'Democrat': return { color: "blue", opacity: 1, fillColor: "blue"};
            }
        }
    }).addTo(map);

the issue looks like it is here...(DynamicMapLayer.js)
_onNewImageLoad: function () {
........
this._map._panes.overlayPane.appendChild(this._newImage);
this._map._panes.overlayPane.removeChild(this._image);

this stops the issue... (not sure if it is the right approach - still new to leaflet.js)

if (this._image == null) {
this._map._panes.overlayPane.appendChild(this._newImage);
} else {
this._map._panes.overlayPane.insertBefore(this._newImage,this._image);
}
this._map._panes.overlayPane.removeChild(this._image);

Load any of these layer into a map and pan around. The layer does not refresh correctly (leaves empty tiles) and is pretty slow. The issue is more obvious when retina is true due to 4x the tiles being generated on the server.

mapUrl = "http://services.arcgisonline.com/ArcGIS/rest/services/Demographics/USA_Average_Household_Size/MapServer"

//http://services.arcgisonline.com/ArcGIS/rest/services/Demographics/USA_Projected_Population_Change/MapServer

//http://services.arcgisonline.com/ArcGIS/rest/services/Demographics/USA_Tapestry/MapServer

L.esri.dynamicMapLayer(mapUrl, {opacity: 0.25, zIndex:2, detectRetina: true}).addTo(map);

i just noticed that the 'GrayLabels' basemapLayer is a little "too" gray.

var map = L.map('map', {
            center : [31, -100],
            zoom : 3
        });

//'Gray' looks good, but something's wrong with 'GrayLabels'
L.esri.basemapLayer("GrayLabels").addTo(map);

There's no "easy" way to know when a FeatureLayer or ClusteredFeatureLayer is loaded so you can get at its properties. This is handy when you want to zoom to add a layer and zoom to it immediately afterward. Also handy for showing load progress.

A simple callback would be nice. e.g.

fl = createLayer();

fl.on("loaded", function(e) {
stopProgress();
map.setView(e.layer.getBounds());
});

We should leveage heatmap js to build dynamic headmaps based on FeatureLayers

http://www.patrick-wied.at/static/heatmapjs/example-heatmap-leaflet.html

1. Currently it's not possible to create an L.esri.basemapLayer() instance by referencing esri-leaflet.min.js or BasemapLayer.js. Please add the namespace to BasemapLayer.js so it can be used in to create the object on it's own without other dependencies.

if(typeof L.esri === "undefined"){
L.esri = {};
}

1. Rebuild .min files.

Tks

Create a feature layer that supports https://github.com/Leaflet/Leaflet.markercluster

Dasa Paddock noticed that most demos dont work on iPhone. All demos probally need a viewport set and maybe some stuff like test boxes to be hidden

http://www.arcgis.com/home/item.html?id=7270fa65d81a4076a2afea1fba18c18d

There may be a performance gain by simplifying geometries before drawing them. We could use http://mourner.github.io/simplify-js/ to handle simplification, but we need a good mapping of zoom levels to tolerance values to get this right.

Bower packages can be registered like so: https://github.com/bower/bower#registering-packages

They require a bower.json manifest file in the root of the repo: https://github.com/bower/bower#defining-a-package

Beware the initial publish request must be perfect, there seems to be a slight problem with the way they handle unregistering packages and correcting mistakes: bower/bower#120

Provide Popup support for Dynamic Layers. Currently, we need to create a global variable for the map on click event result, then use that result within the identify result callback. It would be nice if the popup would work similarly to the feature service.

Here is how I currently handle the popup.

 map.on("click", function(e) {
    mapEvent = e;

    dynLayer.identify(e.latlng, function(data) {
        if(data.results.length > 0)
        {
            var popup = L.popup()
            .setLatLng(mapEvent.latlng)
            .setContent(data.results[0].value)
            .openOn(map);
        }
    });

 });

Error occurs for Demos:

• Add Feature Layer
• Feature Service Info
• Symbolize Point Features
• Symbolize Line Features

Occurring for IE 8-10.

SCRIPT438: Object doesn't support property or method 'defineGetter'
esri-leaflet.min.js, line 4 character 5504

It'd be good to mention how to obtain the submodules in the build instructions, as they aren't entirely common, and if Terraformer and Leaflet are missing the demos fail in a non-obvious way. Fixing was as simple as:

git clone https://github.com/Esri/esri-leaflet
cd esri-leaflet
git submodule init
git submodule update

Leaflet uses Karma and Jasmine to do their testing. This is a solid testing framework I have a lot of experience with and is very compatible with Grunt.

IT would probably be nice to implement a bindPopup method for feature layers like http://leafletjs.com/reference.html#featuregroup-bindpopup but pass the feature information in.

Related to #28