美文网首页Gis专辑gis
arcgis js:文字标注

arcgis js:文字标注

作者: gis杭州 | 来源:发表于2018-05-20 12:45 被阅读6次

    通过设置TextSymbol,设置文字标注,api参考:
    https://developers.arcgis.com/javascript/3/jsapi/textsymbol-amd.html

    代码示例:

    /**
     * 绘制点图层
     * @param name 点位数组 array
     * @param imgUrl 图标url地址 string
     */
    function addGraphic(pointArr,imgUrl) {
    
      pointGraphicLayer.clear();
      pointTextLayer.clear();
      for(var i=0;i < pointArr.length;i++){
    
        //对坐标加偏移后叠加
        var coorArr = coordtransform.wgs84togcj02(pointArr[i].x,pointArr[i].y);
        var point = new esri.geometry.Point(coorArr);
        // var point = new esri.geometry.Point([pointArr[i].x,pointArr[i].y]);
        // var imgUrl = "img/defaultPoint.png";
        var pictureMarkerSymbol = new esri.symbol.PictureMarkerSymbol(imgUrl, 32, 55);
        pictureMarkerSymbol.setOffset(0, 27.5);
        var graphic = new esri.Graphic(point, pictureMarkerSymbol);
        var textsymbol = new esri.symbol.TextSymbol(pointArr[i].name);
        textsymbol.setFont(new esri.symbol.Font("12pt").setWeight(esri.symbol.Font.WEIGHT_BOLD));
        textsymbol.setOffset(32, 55);
        textsymbol.setColor(new esri.Color([255,0,0,0.8]));
        var graphicText = new esri.Graphic(point, textsymbol);
        pointGraphicLayer.add(graphic);
        pointTextLayer.add(graphicText);
      }
    
    }
    

    效果截图:


    image.png

    更多参考:# 解决arcgis javascript textsymbol不支持多行文本标注的问题

    另附openlayer文字标注http://anzhihun.coding.me/ol3-primer/ch07/07-03-07.html

    相关文章

      网友评论

        本文标题:arcgis js:文字标注

        本文链接:https://www.haomeiwen.com/subject/ndazdftx.html