Trazado del centro de una capa de características poligonales

Question

Estoy trabajando con arcGIS javascript api 3.12.

Mi llamada actual para mostrar la capa de características es la siguiente:

var recLayer = new FeatureLayer("http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/3" ,{
  infoTemplate: recParkTemplate,
  outFields: ["STATE_NAME"]
});
map.addLayer(recLayer);

Sin embargo, en lugar de trazar el polígono en el mapa, ya que se trata de un esriGeometricPolygon. Preferiría que se trazara en el mapa como un esriGeometryPoint. Conozco este método para obtener el centroide del polígono específico:

https://developers.arcgis.com/javascript/jsapi/polygon-amd.html#getcentroid

Lo que he hecho hasta ahora es algo así cuando el mapa ha terminado de cargar:

recLayer.on("graphic-add", function(graphic) {
        console.log("\n\n" + recLayer.graphics.length);
        console.log(graphic.graphic);
});

Lo que hace esto es darme el objeto gráfico a medida que se cargan. A partir de aquí me imagino que puedo manipularlos para que muestren sólo el centroide. Sin embargo, esto no está funcionando como se esperaba donde yo pensaría que sería

graphic.getExtent().getCenter();

Esto viene con un error. A partir de ahí, me gustaría cambiar el gráfico a un punto de trazado y luego tener una pantalla de pin en el centro del polígono.

¿Tengo el enfoque correcto? ¿Hay algo que se me escapa?

Aquí está el sitio actual si quiere echarle un vistazo: http://joshferrell.net/ece_project/

Answer 1

Establece la geometría del gráfico mediante el método setGeometry. También establezca el símbolo en el gráfico O puede cambiar el renderizador (usando símbolos de marcador) en la featureLayer cuando ésta se cargue.

var pointSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_SQUARE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,   new esri.Color([255,0,0]), 1),   new esri.Color([0,255,0,0.25]));

recLayer.on("graphic-add", function(graphic) {

    console.log("\n\n" + fl.graphics.length);
    console.log(graphic.graphic.geometry.getCentroid());
    //get centroid
    var centroid = graphic.graphic.geometry.getCentroid();
    //set geometry for the graphic
    graphic.graphic.setGeometry(centroid);
    //set symbol for the graphic
    graphic.graphic.setSymbol(pointSymbol);

});