Generating Fishnet grids on top feature selected on map

998
1
02-14-2014 01:37 AM
vijipat
New Contributor
Hi All,

Is there any way to create fishnet on top of feature selected on map(similar to arc gis desktop functionality)?

Waiting eagerly for your responses.

Thanks & Regards,
Viji
0 Kudos
1 Reply
Pierre-JeanMuller
New Contributor III

Here is the code to produce fishnet with a 0.0001 DD step

 fishNetSymbol = new esri.symbol.SimpleLineSymbol().setColor(new dojo.Color("white"));

 var FishNetLayer = new GraphicsLayer({
                    "id": nameLayer.fishNet
                });


FishNetLayer.on("visibility-change", function (evt) {
                    if (map.getLevel() > 17 && evt.visible)
                        showFishNetLayer(0.0001);
                });

var showFishNetLayer = function (precision) {
        var upperLeftPoint;
        var lowerRightPoint
        require([

           "esri/geometry/webMercatorUtils",
           "dojo/dom",
           "dojo/domReady!"

        ], function (
            webMercatorUtils, dom
          ) {
            upperLeftPoint = webMercatorUtils.xyToLngLat(map.extent.xmin, map.extent.ymax);
            lowerRightPoint = webMercatorUtils.xyToLngLat(map.extent.xmax, map.extent.ymin);
        });

        var mapXMin = floor(upperLeftPoint[0], precision);
        var mapXMax = ceiling(lowerRightPoint[0], precision);
        var mapYMin = floor(lowerRightPoint[1], precision);
        var mapYMax = ceiling(upperLeftPoint[1], precision);
        showFishnet(mapXMin, mapYMax, mapXMax, mapYMin, precision);
    }

var showFishnet = function (mapXMin, mapYMax, mapXMax, mapYMin, precision) {
        mapXMin = parseFloat(mapXMin);
        mapYMax = parseFloat(mapYMax);
        mapXMax = parseFloat(mapXMax);
        mapYMin = parseFloat(mapYMin);
        precision = parseFloat(precision);
        require([
              "esri/layers/GraphicsLayer",
              "esri/geometry/Polyline",
              "esri/graphic",
               "dojo/dom", "dojo/domReady!"
        ], function (
            GraphicsLayer, Graphic, Polyline, domConstruct,dom
            ) {
            for (var x = mapXMin + precision / 2; x < mapXMax; x = x + precision) {
                var singlePathPolyline = new Polyline();
                singlePathPolyline.addPath([[x, mapYMin], [x, mapYMax]]);
                var graphic = new esri.Graphic(singlePathPolyline, fishNetSymbol);
                map.getLayer(nameLayer.fishNet).add(graphic);

            }
            for (var y = mapYMin + precision/2; y < mapYMax; y = y + precision) {
                var singlePathPolyline = new Polyline();
                singlePathPolyline.addPath([[mapXMin, y], [mapXMax, y]]);
                var graphic = new esri.Graphic(singlePathPolyline, fishNetSymbol);
                map.getLayer(nameLayer.fishNet).add(graphic);
            }
        });
    }