arcgis for javascript（4.12）自定义图例

我们开发webgis项目时候经常会遇到地图带图例的需求，arcgis for js4.x提供了esri/widgets/Legend接口用于快速生成图例，上一张官网的图

不过这种图例比较简单，不一定能满足实际的项目需求，而且这种图例只显示地图上可以看得见的图层。只需要需要显示图例的图层放到

layerInfos数组里面就可以了。

var legend = new Legend({

  view: view,

  layerInfos: [{

    layer: featureLayer,

    title: "Legend"  }]

});

view.ui.add(legend, "bottom-right");

也可以自定义图例，在arcgis reast服务里面找到获取地图图例的接口

比如我本地服务发送http://localhost:6080/arcgis/rest/services/china/MapServer/legend?f=json请求就可以拿到图例信息了，然后可以用<img>标签绘制出来

    //添加自定义图例

    function addLegend() {

        var img;

        function add(legendImg) {

            img = document.createElement('img');

            img.src = legendImg

            img.width = 25;

            img.height = 180;

            view.ui.add(img, "bottom-right")

        }

        function visible(type) {

            if (type) {

                img.style.display = "block"

            } else {

                img.style.display = "none"

            }

        }

        return {

            add, visible

        }

    }

效果