He integrado un mapa ArcGIS Esri en una aplicación Angular y tengo algunas ubicaciones alimentadas en una capa de características y esas ubicaciones se muestran en el Mapa ahora como puntos de referencia.
Pero ahora lo que quiero es, cuando el usuario ingrese a la página del mapa , quiero mostrar la vista ampliada de esa ubicación en el mapa.
¿Cómo puedo conseguir esto?
archivo .ts
const map = new Map({ basemap: 'topo-vector', layers: esriLayers }); const view = new MapView({ container, map: map, zoom: 4, center: [-97.63, 38.34], }); const myLocationLayer = new FeatureLayer({ source: locationData.map((d,i)=>( { geometry: new Point({ longitude: d.longitude, latitude: d.latitude }), attributes: { ObjectID: i, ...d } } )), objectIdField: 'ObjectID', geometryType: "point", renderer: renderer, }); map.add(dataFeedLayer); this.view = view;archivo .html
<!-- Map Div --> <div #mapViewNode></div>Como explicó @cabesuon, una vez que tenga una capa de características con las ubicaciones, puede usar el método MapView.goTo(). Acepta múltiples opciones de entrada. Consulte https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#goTo .
En cuanto a obtener una extensión de las características, no tiene que calcularlo usted mismo si ya están en una capa.
view.goTo(dataFeedLayer.source); // sin el zoom extra extra
Si configura la fuente cuando crea FeatureLayer, podría usar:
view.whenLayerView(dataFeedLayer).then(() => { view.goTo({ target: dataFeedLayer.fullExtent.expand(1.2) }) });Si desea restablecer después de que la capa de entidades haya cambiado:
dataFeedLayer.queryExtent().then((results) => { view.goTo({ target: results.extent.expand(1.2) }) });En este caso, debe usar una extensión que incluya todas sus geometrías para inicializar los parámetros de vista, o después de calcular el zoom en esa extensión. Para eso necesitas calcular la extensión.
La particularidad aquí es que sus geometrías son puntos, por lo que no podrá usar métodos de extensión, porque los puntos no tienen extensión.
Pero no se preocupe, calcular la extensión del resultado (es decir, la "extensión total" de sus geometrías) no es difícil.
Aquí hay una pequeña función que puse para ti que puede lograr eso,
export function addPointToExtent( pto: __esri.Point, ext: __esri.geometry.Extent ): __esri.geometry.Extent { if (!pto) { return ext; } let e; if (!ext) { e = new Extent({ xmin: pto.x, xmax: pto.x, ymin: pto.y, ymax: pto.y, spatialReference: { wkid: 102100 } }); } else { e = ext.clone(); if (pto.x < e.xmin) { e.xmin = pto.x; } if (pto.x > e.xmax) { ext.xmax = pto.x; } if (pto.y < e.ymin) { e.ymin = pto.y; } if (pto.y > e.ymax) { ext.ymax = pto.y; } } return e; }Puedes usarlo así,
let ext = addPointToExtent(geoms[0] as Point, null); for (let i = 1; i < geoms.length; i++) { ext = addPointToExtent(geoms[i], ext); } donde geoms es su lista de puntos y ext es la extensión del resultado.
Después de obtener la extensión de su resultado, simplemente haga que la vista se acerque,
view.goTo({ target: ext.expand(1.1) })la expansión es solo una ventaja, para hacerlo un poco más grande.