AnsweredAssumed Answered

How to improve the feature layer renderer performance?

Question asked by leo.deng.transfinder on Jan 2, 2017
Latest reply on Jan 11, 2017 by leo.deng.transfinder

When large amounts of points (about 40,000) on the map (no clusters allowed), the pan / zoom operator will pending for a long time.  Is there any way to improve this? 

 

 

The constraints include: 

1. no cluster allowed

2. using arcgis js api 3.X

3. at least 40,000 points

4. no tiles

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
        <title>Students</title>
        <link rel="stylesheet" href="https://js.arcgis.com/3.18/esri/css/esri.css">
    </head>
    <body>
        <div id="map" style="width: 100%; height: 900px;"></div>
        <script src="https://js.arcgis.com/3.18/"></script>

        <script type="text/javascript">
            require(["esri/map", "esri/layers/FeatureLayer", "esri/symbols/SimpleMarkerSymbol", "esri/renderers/SimpleRenderer", "esri/Color"], function(Map,FeatureLayer,SimpleMarkerSymbol,SimpleRenderer,Color){
                var map = new Map("map", {
                    basemap: "streets",
                    center: [-87.252628,30.639658],
                    zoom: 10,
                    logo: false,
                    showAttribution: false
                });

                var url = "https://services.arcgis.com/a3bwkdJaVo8mjuX0/arcgis/rest/services/Escambia_Students/FeatureServer/0";
                var studentLayer = new FeatureLayer(url,{
                    id: "student",
                    mode: FeatureLayer.MODE_SNAPSHOT,
                    outFields: ["*"]
                });

                var symbol = new SimpleMarkerSymbol().setColor(new Color("blue")).setSize(6);
                var renderer = new SimpleRenderer(symbol);
                studentLayer.setRenderer(renderer);

                map.addLayers([studentLayer]);
            });
        </script>

    </body>
</html>

Outcomes