将文本添加到ArcGIS Javascript图层

时间:2016-06-24 20:26:19

标签: javascript arcgis-js-api

我正在使用ArcGIS Javascrit SDK,用于在地图上放置带文字的标记的基本用户案例。我可以添加标记,但是我遇到了在该标记上插入文本的问题。

这是我的代码:

require([
    "esri/map",
    "esri/dijit/BasemapToggle",
    "esri/dijit/LocateButton",
    "esri/geometry/Point",
     "esri/symbols/SimpleMarkerSymbol", 
     "esri/symbols/SimpleLineSymbol", 
     "esri/symbols/Font",
     "esri/symbols/TextSymbol", 
     "esri/Color",
    "esri/graphic", 
    "esri/layers/GraphicsLayer",
    "dojo/domReady!"
], function(
  Map, BasemapToggle, LocateButton, Point, SimpleMarkerSymbol, Font, TextSymbol, SimpleLineSymbol, Color, Graphic, GraphicsLayer
)  {
      map = new Map("map", {
        center: [mapval[0][2],mapval[0][1]],
        zoom: 18,
        basemap: "streets"
      });

        map.on("load", function() {
            var gl = new GraphicsLayer();
            var font = new Font("20px", Font.STYLE_NORMAL, Font.VARIANT_NORMAL, Font.WEIGHT_BOLDER);
            for (var i=0;i<mapval.length;i++){
                    var p = new Point(mapval[i][2], mapval[i][1]);
                    var s = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 20,
                        new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
                        new Color([255,0,0]), 1),
                        new Color([0,255,0,0.25]));
                    var g = new Graphic(p, s);
                    g.setAttributes({
                        name: mapval[i][0]
                    });
                    gl.add(g);

                    var t = new TextSymbol(mapval[i][0],font, new Color([0, 0, 0]));
                    var g2 = new Graphic(p, t);
                    gl.add(g2);
            }


            map.addLayer(gl);                   
        });

  var toggle = new BasemapToggle({
    map: map,
    visible: true,
    basemap: "satellite"
  }, "BasemapToggle");
  toggle.startup();

  var geoLocate = new LocateButton({
    map: map
  }, "LocateButton");
  geoLocate.startup();

});

1 个答案:

答案 0 :(得分:0)

require中的SimpleLineSymbol位于错误的位置。一旦修正后与功能对齐,就会显示标签。