Пользовательский графический слой ArcGIS (JavaScript)

Question

Я работаю над приложением, которое будет извлекать данные из разных источников и создавать объекты ESRI GraphicsLayer из данных и отображать их на карте. Я создал пользовательские FeatureLayers раньше, но для этого проекта требуется использование GraphicsLayers, потому что мне нужно иметь возможность переключать видимость слоев. Код ниже извлекает данные с хоста и помещает его в GraphicsLayer.

define(["dojo/_base/declare", "dojo/_base/array", "dojo/request", "esri/graphic", "esri/geometry/Geometry", "esri/InfoTemplate"], 
    function(declare, array, request, Graphic, Geometry, InfoTemplate) { 
    return declare(null, { 
     getAllCurrentReadings: function() { 
     var rtn = []; 
     var stations = ["S", "SN", "AN", "UP", "GR", "PL", "SR", "J", "N", "FL"]; 
     array.forEach(stations, function(item, i) { 
      request.post("includes/buoybay_proxy.php", { 
      data: { 
       "method": "RetrieveCurrentReadings", 
       "params": "CBIBS," + item + ",113f8b...f27e0a0bb" // NOTE: id: 1 is necessary as well but is added manually by jsonRPCClient 
      }, 
      sync: true, 
      handleAs: "json" 
      }).then(
      function(response) { 
       var gfx, attr, t; 
       //console.log(response); 
       // Now build the Graphic Object and push it into rtn 
       gfx = new Graphic(); 
       gfx.spatialReference = { 
       wkid: 102100 
       }; 

       // Define attribute object 
       attr = {}; 
       attr["station"] = response.station; 
       attr["title"] = translateStationID(response.station); 
       for (var j = 0; j < response.measurement.length; j++) { 
       attr[String(response.measurement[j])] = response.value[j]; 
       } 
       gfx.attributes = attr; 

       // Define geometry object 
       gfx.geometry = new Geometry(gfx.spatialReference, "point"); 
       gfx.geometry.spatialReference = { 
       wkid: 102100 
       }; 
       gfx.geometry.type = "point"; 
       t = esri.geometry.geographicToWebMercator(new esri.geometry.Point(attr["longitude"], attr["latitude"], gfx.spatialReference)); 
       gfx.geometry.x = t.x; 
       gfx.geometry.y = t.y; 

       // Define infoTemplate object 
       gfx.infoTemplate = new esri.InfoTemplate(); 
       gfx.infoTemplate.setTitle(attr["title"]); 
       gfx.infoTemplate.setContent("${*}"); 

       // Define symbol 
       gfx.symbol = new esri.symbol.PictureMarkerSymbol("../images/marker.png", 15, 15); 

       //console.log(gfx); 
       rtn.push(gfx); 
      }, 
      function(error) { 
       console.log("Error: " + error + "\n"); 
      } 
     ) 
     }); 
     //console.log(rtn); 
     return rtn; 
     } 
    }) 
    }) 

Этот код кажется построить GraphicsLayers правильно, но когда я добавляю их к объекту карты нет точек отображаются на карте. Код, который я использую для добавления их в объект карты, приведен ниже.

require(["dojo/parser", "dojo/_base/array", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/ready", "esri/map", "esri/layers/ArcGISTiledMapServiceLayer", "js/cbibsGfxModule", "dojo/domReady!"], 
    function(parser, array, BorderContainer, ContentPane, ready, map, ArcGISTiledMapServiceLayer, cbibsGfxModule) { 
    var Map, cbibs, gfxLayer, t = []; 

    function init() { 
     Map = new map("mapDiv", { 
     basemap: "oceans", 
     center: [-77.0357, 38.7877], 
     zoom: 7 
     }); 
     dojo.connect(Map, "onLoad", displayData); // Map didn't load until 3rd arg was a function name; why? 

     function displayData() { 
     cbibs = new cbibsGfxModule(); 
     t = cbibs.getAllCurrentReadings(); 
     gfxLayer = new esri.layers.GraphicsLayer(); 
     array.forEach(t, function(item) { 
      gfxLayer.add(item); 
      Map.graphics.add(item); 
     }); 
     gfxLayer.spatialReference = { 
      wkid: 102100 
     }; 
     //Map.addLayer(gfxLayer); // Add GraphicsLayer to Map object 
     console.log(Map); // Custom GraphicLayers are under _layers 
     }; 
    }; 
    dojo.ready(init); 
    } 
); 

Я понимаю, что gfxLayer.add(item) и Map.graphics.add(item) несколько излишним, но даже с данными в двух местах в карте объекта точки все еще не отображаются на карте.

Я работаю над этим в течение некоторого времени, и я действительно свеж от идей. Любая помощь, которую может предложить любой человек, будет очень благодарна. Спасибо.

Answer 1

Ваш вопрос (или, по меньшей мере, один выпуск) в строке, где вы пытаетесь проецировать Географические координаты в Web Mercator:

t = esri.geometry.geographicToWebMercator(
new esri.geometry.Point(attr["longitude"], attr["latitude"], gfx.spatialReference)); 

В конструкторе Поинт вы правильно переходящая в вашей долготы и широты , но затем укажите пространственную привязку через gfx.spatialReference, которая установлена ​​на 102100. 102100 - это WKID для Web Mercator. Но ваши входные данные являются географическими десятичными градусами, поэтому вам нужна пространственная ссылка с WKID = 4326 для представления GCS WGS84. Поэтому ваша строка должна быть следующей:

t = esri.geometry.geographicToWebMercator(
    new esri.geometry.Point(attr["longitude"], attr["latitude"], 
    new esri.SpatialReference(4326)); 

Это ваша основная проблема.

Кроме того, линия:

gfx.spatialReference = { wkid: 102100 }; 

не имеет никакого эффекта. Объект GraphicsReference не существует на объекте Graphics - только на Graphics.geometry - где вы его правильно устанавливаете.

Только один последний комментарий - вы говорите, что здесь вы используете слой геометрии вместо слоя функций, потому что вам нужно переключать видимость, но вы можете переключать видимость любого слоя, включая слои объектов.