Alimente datos de ubicación en el Mapa de Esri y muestre las ubicaciones en el mapa de Esri como puntos de señalización.

Quiero pasar algunos datos de ubicación (latitud, longitud, etc.) de algunos estados de los EE. UU. al mapa de ArcGIS Esri y mostrar esas ubicaciones en el mapa de Esri como marcadores (como en Google Maps). Actualmente, mi código Angular es el siguiente y no pude encontrar ninguna documentación de ArcGIS sobre cómo suministrar datos al Mapa de Esri.

Por favor, avíseme si tiene alguna idea sobre cómo lograr esto.

esri-map-component.html

— Div del Mapa —

esri-map-component.ts

// El

div> donde se carga el mapa
public featureLayerUrl = environment.parcelAtlasUrl;
public webMapId = environment.webMapId;
@ViewChild(‘mapViewNode’, { static: true }) private mapViewEl: ElementRef;

ngOnInit(): void {
this.getEsriToken();
}

getEsriToken(){
this.esriMapService.getEsriAccessToken().subscribe(
res => {
this.esriToken = res.token;
if(res.token){
this.initializeMap(this.esriToken);
}
},
error =>{
},

() => {
}
);
}

// Inicializar MapView y devolver una instancia de MapView
inicializarMapa(esriToken) {
const container = this.mapViewEl.nativeElement;
config.apiKey = esriToken;

// cargar el webMap
const webmap = new WebMap({
portalItem: {
id: this.webMapId
}
});

// cargar la capa de entidad ParcelAtlas
const layer = new FeatureLayer({
url: this.featureLayerUrl,
});
webmap.add(layer);

const view = new MapView({
container,
map: webmap
});
this.view = view;
return this.view.when();
}

davy.ai

May 31, 2023 at 11:57 pm

Para pasar datos de ubicación de estados de Estados Unidos a un mapa ArcGIS Esri, puedes utilizar la API de JavaScript de ArcGIS para crear una capa de gráficos y añadir gráficos en ella. Cada gráfico representa una ubicación exacta en el mapa y puedes establecer su geometría en la latitud y longitud de la ubicación que deseas mostrar.

Aquí tienes un ejemplo de cómo añadir un gráfico a una capa de gráficos:

const graphicsLayer = new GraphicsLayer();
const point = {
  type: "point",
  longitude: -118.2437,
  latitude: 34.0522
};
const marker = new SimpleMarkerSymbol({
  color: [226, 119, 40],
  outline: {
    color: [255, 255, 255],
    width: 2
  }
});
const graphic = new Graphic({
  geometry: point,
  symbol: marker
});
graphicsLayer.add(graphic);

Para integrar este código en tu componente Angular, puedes añadirlo a la función initializeMap después de crear el MapView. Por ejemplo:

async initializeMap(esriToken) {
  const container = this.mapViewEl.nativeElement;
  config.apiKey = esriToken;

  const graphicsLayer = new GraphicsLayer();
  const point = {
    type: "point",
    longitude: -118.2437,
    latitude: 34.0522
  };
  const marker = new SimpleMarkerSymbol({
    color: [226, 119, 40],
    outline: {
      color: [255, 255, 255],
      width: 2
    }
  });
  const graphic = new Graphic({
    geometry: point,
    symbol: marker
  });
  graphicsLayer.add(graphic);

  const webmap = new WebMap({
    portalItem: {
      id: this.webMapId
    }
  });
  const layer = new FeatureLayer({
    url: this.featureLayerUrl
  });
  webmap.add(layer);

  const view = new MapView({
    container,
    map: webmap,
    layers: [graphicsLayer]
  });
  this.view = view;
  await this.view.when();
}

Este código añade un gráfico único con las coordenadas de Los Ángeles, California, pero puedes reemplazar esto con una matriz de coordenadas para los estados que deseas mostrar. También puedes personalizar el símbolo del marcador para adaptarlo a tus necesidades.

Una vez que hayas añadido todos los gráficos que deseas mostrar, deberían aparecer como puntos precisos en el mapa.

Answer

davy.ai

May 31, 2023 at 11:57 pm
Para pasar datos de ubicación de estados de Estados Unidos a un mapa ArcGIS Esri, puedes utilizar la API de JavaScript de ArcGIS para crear una capa de gráficos y añadir gráficos en ella. Cada gráfico representa una ubicación exacta en el mapa y puedes establecer su geometría en la latitud y longitud de la ubicación que deseas mostrar.

Aquí tienes un ejemplo de cómo añadir un gráfico a una capa de gráficos:
```
const graphicsLayer = new GraphicsLayer();
const point = {
  type: "point",
  longitude: -118.2437,
  latitude: 34.0522
};
const marker = new SimpleMarkerSymbol({
  color: [226, 119, 40],
  outline: {
    color: [255, 255, 255],
    width: 2
  }
});
const graphic = new Graphic({
  geometry: point,
  symbol: marker
});
graphicsLayer.add(graphic);
```
Para integrar este código en tu componente Angular, puedes añadirlo a la función initializeMap después de crear el MapView. Por ejemplo:
```
async initializeMap(esriToken) {
  const container = this.mapViewEl.nativeElement;
  config.apiKey = esriToken;

  const graphicsLayer = new GraphicsLayer();
  const point = {
    type: "point",
    longitude: -118.2437,
    latitude: 34.0522
  };
  const marker = new SimpleMarkerSymbol({
    color: [226, 119, 40],
    outline: {
      color: [255, 255, 255],
      width: 2
    }
  });
  const graphic = new Graphic({
    geometry: point,
    symbol: marker
  });
  graphicsLayer.add(graphic);

  const webmap = new WebMap({
    portalItem: {
      id: this.webMapId
    }
  });
  const layer = new FeatureLayer({
    url: this.featureLayerUrl
  });
  webmap.add(layer);

  const view = new MapView({
    container,
    map: webmap,
    layers: [graphicsLayer]
  });
  this.view = view;
  await this.view.when();
}
```
Este código añade un gráfico único con las coordenadas de Los Ángeles, California, pero puedes reemplazar esto con una matriz de coordenadas para los estados que deseas mostrar. También puedes personalizar el símbolo del marcador para adaptarlo a tus necesidades.

Una vez que hayas añadido todos los gráficos que deseas mostrar, deberían aparecer como puntos precisos en el mapa.

Comments are closed.

es.davy.ai

¿Tienes una pregunta?

Alimente datos de ubicación en el Mapa de Esri y muestre las ubicaciones en el mapa de Esri como puntos de señalización.

Answer

davy.ai