Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.
# Cómo usar mapas estáticos
Estos temas de aprendizaje ofrecen una guía paso a paso para personalizar mapas estáticos con superposiciones y elementos visuales, mediante las capacidades cartográficas de Amazon Location Service. Cada guía explica las tareas clave, como ajustar las dimensiones del mapa, elegir entre el zoom o el radio y agregar varios elementos geoespaciales, como marcadores, polígonos, líneas y círculos de proximidad. Estas guías utilizan formatos compactos y GeoJSON para garantizar la flexibilidad en el estilo y la configuración.
Si está optimizando mapas para aplicaciones orientadas al cliente o realizando análisis geoespaciales, estos temas proporcionan instrucciones claras sobre cómo personalizar los mapas estáticos para adaptarlos a requisitos específicos. Si sigue los ejemplos detallados, obtendrá información sobre cómo mejorar las presentaciones de los mapas y a gestionar de forma eficiente los datos geográficos para satisfacer diversas necesidades empresariales.
**Topics**
+ [Cómo obtener un mapa estático de una posición específica](get-static-map-specific-position.md)
+ [Cómo obtener un mapa estático de una dimensión específica](get-static-map-specific-dimension.md)
+ [Cómo decidir entre el radio y el zoom para un mapa estático](choose-radius-vs-zoom.md)
+ [Cómo agregar una escala a un mapa estático](add-scale-static-map.md)
+ [Cómo agregar un marcador a un mapa estático](add-marker-static-map.md)
+ [Cómo agregar una línea a un mapa estático](how-to-add-line-static.md)
+ [Cómo agregar una ruta a un mapa estático](how-to-add-route.md)
+ [Cómo agregar un polígono a un mapa estático](how-to-add-polygon-static.md)
+ [Cómo configurar el idioma de los mapas estáticos](set-language-static-map.md)
+ [Cómo agregar un círculo de proximidad a un mapa estático](how-to-add-proximity-circle.md)
# Cómo obtener un mapa estático de una posición específica
En este tema, obtendrá información sobre cómo recuperar mapas estáticos de Amazon Location Service en función de parámetros específicos. Obtendrá información sobre cómo generar un mapa estático para una posición central, un cuadro delimitador y un conjunto de posiciones delimitadas. Los ejemplos proporcionados le ayudarán a personalizar la anchura, la altura y el estilo del mapa.
**nota**
Debe aprobar `map` o `map@2x` al generar un mapa estático.
## Obtención de una imagen de mapa para una posición central
En este ejemplo, creará una imagen de mapa con una anchura de `1024` y una altura de `1024` con las coordenadas centrales definidas en `-123.1143,49.2763`, dónde `longitude=-123.1143` y `latitude=49.2763`, y un nivel de zoom de `15`.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&zoom=15¢er=-123.1156126,49.2767046&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of a coastal city with dense urban layout, harbor, and large stadium visible.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-center.png)
------
## Obtención de la imagen del mapa para el cuadro delimitador
En este ejemplo, generará una imagen de mapa del sureste asiático configurando el cuadro delimitador del área.
El formato de `bbox` es `{southwest_longitude},{southwest_latitude},{northeast_longitude},{northeast_latitude}`.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&bounding-box=90.00,-21.94,146.25,31.95&key=API_KEY
```
------
#### [ Response image ]
![\[Satellite view of Southeast Asia, showing mainland, islands, and surrounding waters.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-bounding-box.png)
------
## Obtención de una imagen de mapa para las posiciones delimitadas
En este ejemplo, generará un mapa que cubre varios lugares imperdibles en París, cada uno especificado por sus coordenadas (longitud, latitud). Las posiciones delimitadas incluyen: la Torre Eiffel, el Museo del Louvre, la Catedral de Notre-Dame, los Campos Elíseos, el Arco del Triunfo, la Basílica del Sagrado Corazón, los Jardines de Luxemburgo, el Museo de Orsay, la Place de la Concordia y la Ópera Garnier.
El formato de las posiciones delimitadoras es `{longitude1},{latitude1},{longitude2},{latitude2} ... {longitudeN},{latitudeN}`.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&bounded-positions=2.2945,48.8584,2.3376,48.8606,2.3500,48.8529,2.3076,48.8698,2.2950,48.8738,2.3431,48.8867,2.3372,48.8462,2.3266,48.8600,2.3212,48.8656,2.3317,48.8719&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of Paris showing dense urban layout, Seine River, and iconic landmarks.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-bounding-position.png)
------
# Cómo obtener un mapa estático de una dimensión específica
En este tema, aprenderá a configurar las dimensiones (altura y anchura) de los mapas estáticos mediante Amazon Location Service. La personalización de las dimensiones de una imagen de mapa le permite equilibrar el rendimiento, la calidad visual y el uso. Los valores máximos para `width` y `height` son 1400 píxeles, mientras que los valores mínimos son 64 píxeles. El tamaño máximo del resultado es 6 MB.
Además, puede usar los parámetros `bbox` y `bounds` junto con `padding` para asegurarse de que las características importantes del mapa cercanas a los bordes estén completamente visibles y no estén cortadas.
## Obtención de una imagen de mapa con una altura y un ancho específicos
En este ejemplo, creará una imagen de mapa de baja y media resolución de Helsinki, Finlandia.
------
#### [ Request URL for low-resolution thumbnail ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=200&height=200&zoom=11.5¢er=24.9460,60.1690&key=API_KEY
```
------
#### [ Response (Thumbnail 200x200) ]
![\[Aerial view of a coastal city with intricate waterways, islands, and urban development.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-specific-dimension-low.png)
------
#### [ Request URL for mid-resolution image ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=700&height=700&zoom=13¢er=24.9460,60.1690&key=API_KEY
```
------
#### [ Response image (700x700) ]
![\[Aerial view of a coastal city with dense urban development, harbors, and surrounding waters.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-specific-dimension-mid.png)
------
## Obtención de una imagen de mapa con relleno en todos los lados
En este ejemplo, generará un mapa con varios lugares imperdibles en Helsinki (Finlandia), con sus coordenadas (longitud, latitud), con y sin relleno.
------
#### [ Request URL with padding ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=150&bounded-positions=24.9526,60.1692,24.9850,60.1465,24.9270,60.1725,24.9226,60.1826,24.9509,60.1675,24.9566,60.1685,24.9457,60.1674,24.9397,60.1719,24.9414,60.1715,24.9387,60.1720&key=API_KEY
```
------
#### [ Response image (with padding) ]
![\[Aerial view of a coastal city with dense urban areas, harbors, and surrounding islands.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-specific-dimension-padding.png)
------
#### [ Request URL without padding ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&bounded-positions=24.9526,60.1692,24.9850,60.1465,24.9270,60.1725,24.9226,60.1826,24.9509,60.1675,24.9566,60.1685,24.9457,60.1674,24.9397,60.1719,24.9414,60.1715,24.9387,60.1720&key=API_KEY
```
------
#### [ Response image (without padding) ]
![\[Aerial view of a coastal city with dense urban areas, harbors, and small islands.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-specific-dimension-no-padding.png)
------
# Cómo decidir entre el radio y el zoom para un mapa estático
En este tema, aprenderá a elegir entre usar `radius` o `zoom` al generar mapas estáticos con Amazon Location Service. El parámetro `radius` proporciona un control más preciso sobre el área de cobertura, lo que lo hace ideal para aplicaciones orientadas al cliente en las que se conoce el área de cobertura exacta. El parámetro `zoom` es más adecuado para el análisis geoespacial cuando se desea ajustar el nivel de detalle que se muestra.
## Con radio
En este ejemplo, creará una imagen de mapa de Sri Lanka con el parámetro `radius` con una ubicación central.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=700&height=700¢er=80.60596,7.76671&radius=235000&scale-unit=KilometersMiles&key=API_KEY
```
------
#### [ Response image ]
![\[Satellite view of Sri Lanka, showing the teardrop-shaped island nation surrounded by ocean.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-radius.png)
------
## Con zoom
En este ejemplo, creará una imagen de mapa de Sri Lanka con el parámetro `zoom` con una ubicación central.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=700&height=700&zoom=8¢er=80.60596,7.76671&scale-unit=KilometersMiles&key=API_KEY
```
------
#### [ Response image ]
![\[Satellite view of Sri Lanka, showing the teardrop-shaped island nation surrounded by ocean.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-zoom.png)
------
# Cómo agregar una escala a un mapa estático
En este tema, aprenderá a mostrar una escala en la esquina inferior derecha de un mapa estático generado con Amazon Location Service. La escala puede mostrar una sola unidad, como `Miles` o `Kilometers`, o ambas unidades, como `KilometersMiles` o `MilesKilometers`, con una unidad en la parte superior y la otra en la inferior.
## Agregación de la escala con una sola unidad
En este ejemplo, mostrará un mapa de Helsinki (Finlandia) con la escala establecida en `Kilometers` en la esquina inferior derecha.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&zoom=13.5¢er=24.9189564,60.1645772&scale-unit=Kilometers&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of a coastal city with dense urban areas, waterways, and islands.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-scale-single.png)
------
## Agregación de la escala con ambas unidades
En este ejemplo, mostrará un mapa de Helsinki (Finlandia) con `Kilometers` y `Miles` mostrados en la escala de la esquina inferior derecha, con una unidad encima de la otra.
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&zoom=14¢er=24.9189564,60.1645772&scale-unit=KilometersMiles&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of a coastal city with dense urban areas, harbors, and islands surrounded by water.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-scale-both.png)
------
# Cómo agregar un marcador a un mapa estático
En este tema, obtendrá información sobre cómo agregar marcadores a los mapas estáticos generados con Amazon Location Service. Puede personalizar el icono, la etiqueta, el tamaño, el color y otras opciones de estilo del marcador. Esto le permite resaltar ubicaciones específicas con señales visuales que se alinean con el propósito del mapa.
## Estilos de marcador
| Nombre | Tipo | Predeterminado/a | Descripción |
| --- | --- | --- | --- |
| `style` | Cadena | `marker` | El estilo de la geometría de puntos. Para crear un marcador, defina el valor en `marker` o no incluya el atributo `style` en el objeto de propiedades del GeoJSON. |
| `icon` | Cadena | `pin` | El tipo de icono del marcador. Los valores disponibles incluyen: `cp` (círculo de proximidad), `diamond`, `pin`, `poi`, `square`, `triangle`, `bubble`. |
| `label` | Cadena | `` | El texto para mostrar en las coordenadas. Para configurar etiquetas automáticas, utilice los siguientes valores: `$alpha` (alfabeto latino) o `$num` (números arábigos). |
| `color` | Color | Dependiente del estilo | El color del icono. |
| `outline-color` | Color | Dependiente del estilo | El color del esquema del icono. |
| `text-color` | Color | Dependiente del estilo | El color del texto de la etiqueta. |
| `text-outline-color` | Color | Dependiente del estilo | El color del esquema del texto. |
| `outline-width` | Entero | `0` (desactivado) | El ancho del esquema del texto. |
| `size` | Cadena | `medium` | El tamaño de la etiqueta y el icono. Valores disponibles: `small`, `medium`, `large`. |
## Agregación de un marcador a una imagen de mapa
En este ejemplo, colocará un marcador con una etiqueta en la imagen del mapa de BC Place, Vancouver.
`Geo JSON`:
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
-123.11210,
49.2767875
]
},
"properties": {
"color":"#EE4B2B",
"size":"large",
"label":"BC Place, Vancouver",
"text-color":"#0000FF"
}
}
]
}
```
`Compact`:
```
point: -123.11210,49.27678;
label=BC Place, Vancouver;
size=large;
text-color=#0000FF;
color=#EE4B2B
```
------
#### [ Request URL ]
Con la superposición de GeoJSON
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&zoom=15&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22properties%22%3A%7B%22color%22%3A%22%23EE4B2B%22,%22size%22%3A%22large%22,%22label%22%3A%22BC%20Place,%20Vancouver%22,%22text-color%22%3A%22%230000FF%22%7D,%22geometry%22%3A%7B%22coordinates%22%3A%5B-123.11210974152168,49.27678753813112%5D,%22type%22%3A%22Point%22%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of Vancouver's downtown and harbor, with BC Place stadium marked.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-add-marker.png)
------
## Agregación de varios marcadores a una imagen de mapa
En este ejemplo, agregará marcadores para los lugares imperdibles de Helsinki (Finlandia) mediante sus coordenadas (longitud, latitud). También puede aplicar un relleno para garantizar que el mapa contenga todos los marcadores correctamente.
**nota**
El tipo de icono de marcador disponible incluye: `cp` para círculo de proximidad, `diamond, pin, poi, square, triangle, bubble`.
`Geo JSON`:
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "MultiPoint",
"coordinates": [
[24.9526, 60.1692],
[24.9270, 60.1725],
[24.9226, 60.1826],
[24.9509, 60.1675],
[24.9566, 60.1685],
[24.9457, 60.1674],
[24.9397, 60.1719],
[24.9414, 60.1715],
[24.9387, 60.1720]
]
},
"properties": {
"icon":"diamond",
"label":"$num",
"size":"large",
"text-color":"%23972E2B",
"text-outline-color":"%23FFF",
"text-outline-width":2
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=150&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22MultiPoint%22,%22coordinates%22%3A%5B%5B24.9526,60.1692%5D,%5B24.927,60.1725%5D,%5B24.9226,60.1826%5D,%5B24.9509,60.1675%5D,%5B24.9566,60.1685%5D,%5B24.9457,60.1674%5D,%5B24.9397,60.1719%5D,%5B24.9414,60.1715%5D,%5B24.9387,60.172%5D%5D%7D,%22properties%22%3A%7B%22icon%22%3A%22diamond%22,%22label%22%3A%22%24num%22,%22size%22%3A%22large%22,%22text-color%22%3A%22%23972E2B%22,%22text-outline-color%22%3A%22%23FFF%22,%22text-outline-width%22%3A2%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of a city with lakes, buildings, roads, and numbered markers indicating points of interest.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-add-multi-markers.png)
------
## Cambio del color del marcador en una imagen de mapa
En este ejemplo, utilizará marcadores de burbujas de diferentes colores para representar ciudades de todo el mundo. Puede personalizar el color, la etiqueta y otras propiedades del marcador para adaptarlos al contexto del mapa.
`Geo JSON`:
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [85.1376, 25.5941]
},
"properties": {
"label": "Patna",
"icon": "bubble",
"color": "#FF5722",
"outline-color": "#D74D3D",
"text-color": "#FFFFFF"
}
},
.....redacted.....
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [2.3522, 48.8566]
},
"properties": {
"label": "Paris, France",
"icon": "bubble",
"color": "#FF9800",
"outline-color": "#D76B0B",
"text-color": "#FFFFFF"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1400&height=1024&padding=150&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B85.1376,25.5941%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Patna%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%23FF5722%22,%22outline-color%22%3A%22%23D74D3D%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B105.8542,21.0285%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Hanoi,%20Vietnam%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%232196F3%22,%22outline-color%22%3A%22%231A78C2%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B116.4074,39.9042%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Beijing,%20China%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%23FF9800%22,%22outline-color%22%3A%22%23D76B0B%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B106.9101,47.918%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Ulaanbaatar,%20Mongolia%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%239C27B0%22,%22outline-color%22%3A%22%237B1FA2%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B151.2093,-33.8688%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Sydney,%20Australia%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%234CAF50%22,%22outline-color%22%3A%22%23388E3C%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22Point%22,%22coordinates%22%3A%5B174.7633,-41.2865%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Wellington,%20New%20Zealand%22,%22icon%22%3A%22bubble%22,%22color%22%3A%22%23FFC107%22,%22outline-color%22%3A%22%23FFA000%22,%22text-color%22%3A%22%23000000%22%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[World map showing locations of major cities across continents with colored labels.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-change-marker-color.png)
------
# Cómo agregar una línea a un mapa estático
En este tema, obtendrá información sobre cómo agregar una línea a un mapa estático con Amazon Location Service. Abordaremos las opciones de estilo compatibles, cómo definir una línea con GeoJSON y cómo aplicar estilos personalizados como el color, el ancho y el contorno. También exploraremos cómo usar diferentes unidades de medida para propiedades como el ancho de línea.
## Estilos compatibles
| Nombre | Tipo | Predeterminado/a | Descripción |
| --- | --- | --- | --- |
| `color` | Color | dependiente del estilo | El color de la línea. |
| `width` | Entero/cadena | 2 | El ancho de la línea. Para obtener más información, consulte [Cómo agregar una línea a un mapa estático](#how-to-add-line-static). |
| `outline-color` | Color | dependiente del estilo | El color del esquema de la línea. |
| `outline-width` | Entero/cadena | 0 (desactivado) | El ancho del esquema. Para obtener más información, consulte [Cómo agregar una línea a un mapa estático](#how-to-add-line-static). |
## Unidad compatible
| Unidad | Descripción |
| --- | --- |
| Entero, por ejemplo, `5` | Píxeles |
| Cadena sin unidad, por ejemplo `"5"` | Píxeles |
| `"px"` | Píxeles |
| `"m"` | Metros |
| `"km"` | Kilómetros |
| `"mi"` | Millas |
| `"ft"` | Pies |
| `"yd"` | Yardas |
| `"%"` | El porcentaje del valor predeterminado de una propiedad específica, en píxeles. Por ejemplo, si el valor predeterminado para `width` son `2` píxeles, entonces `200%` son `4` píxeles. `%` es un carácter confidencial que se debe codificar en la URL de la solicitud como `%25`. |
## Agregación de una línea
En este ejemplo, agregará una línea desde un lugar de Vancouver hasta Stanley Park. La línea se crea con un formato GeoJSON con coordenadas definidas.
------
#### [ Request ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": [
[-123.11813, 49.28246],
[-123.11967, 49.28347],
[-123.12108, 49.28439],
[-123.12216, 49.28507],
[-123.12688, 49.28812],
[-123.1292, 49.28964],
[-123.13216, 49.2916],
[-123.13424, 49.29291],
[-123.13649, 49.2944],
[-123.13678, 49.29477],
[-123.13649, 49.29569],
[-123.13657, 49.29649],
[-123.13701, 49.29715],
[-123.13584, 49.29847],
[-123.13579, 49.29935],
[-123.13576, 49.30018],
[-123.13574, 49.30097]
]
},
"properties": {
"name": "To Stanley Park",
"description": "An evening walk to Stanley Park."
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=200&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22LineString%22,%22coordinates%22%3A%5B%5B-123.11813,49.28246%5D,%5B-123.11967,49.28347%5D,%5B-123.12108,49.28439%5D,%5B-123.12216,49.28507%5D,%5B-123.12688,49.28812%5D,%5B-123.1292,49.28964%5D,%5B-123.13216,49.2916%5D,%5B-123.13424,49.29291%5D,%5B-123.13649,49.2944%5D,%5B-123.13678,49.29477%5D,%5B-123.13649,49.29569%5D,%5B-123.13657,49.29649%5D,%5B-123.13701,49.29715%5D,%5B-123.13584,49.29847%5D,%5B-123.13579,49.29935%5D,%5B-123.13576,49.30018%5D,%5B-123.13574,49.30097%5D%5D%7D,%22properties%22%3A%7B%22name%22%3A%22To%20Stanley%20Park%22,%22description%22%3A%22An%20evening%20walk%20to%20Stanley%20Park.%22%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of coastal city with dense urban area, marina, and surrounding forests.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-add-line.png)
------
## Agregación de estilo a la línea
En este ejemplo, aplicará estilo a la línea que se ha agregado en el ejemplo anterior. Esto incluye definir el color y el ancho de la línea, y el color y el ancho del contorno para personalizar el aspecto visual de la línea en el mapa.
------
#### [ Request ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": [
[-123.11813, 49.28246],
[-123.11967, 49.28347],
[-123.12108, 49.28439],
[-123.12216, 49.28507],
[-123.12688, 49.28812],
[-123.1292, 49.28964],
[-123.13216, 49.2916],
[-123.13424, 49.29291],
[-123.13649, 49.2944],
[-123.13678, 49.29477],
[-123.13649, 49.29569],
[-123.13657, 49.29649],
[-123.13701, 49.29715],
[-123.13584, 49.29847],
[-123.13579, 49.29935],
[-123.13576, 49.30018],
[-123.13574, 49.30097]
]
},
"properties": {
"color": "#6d34b3",
"width": "9m",
"outline-color": "#a8b9cc",
"outline-width": "2px"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=200&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%22LineString%22,%22coordinates%22%3A%5B%5B-123.11813,49.28246%5D,%5B-123.11967,49.28347%5D,%5B-123.12108,49.28439%5D,%5B-123.12216,49.28507%5D,%5B-123.12688,49.28812%5D,%5B-123.1292,49.28964%5D,%5B-123.13216,49.2916%5D,%5B-123.13424,49.29291%5D,%5B-123.13649,49.2944%5D,%5B-123.13678,49.29477%5D,%5B-123.13649,49.29569%5D,%5B-123.13657,49.29649%5D,%5B-123.13701,49.29715%5D,%5B-123.13584,49.29847%5D,%5B-123.13579,49.29935%5D,%5B-123.13576,49.30018%5D,%5B-123.13574,49.30097%5D%5D%7D,%22properties%22%3A%7B%22color%22%3A%22%236d34b3%22,%22width%22%3A%229m%22,%22outline-color%22%3A%22%23a8b9cc%22,%22outline-width%22%3A%222px%22%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of coastal city with dense urban area, marina, and surrounding forests.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-add-line-styling.png)
------
# Cómo agregar una ruta a un mapa estático
En este tema, obtendrá información sobre cómo agregar una ruta a un mapa estático con Amazon Location Service. Repasará los pasos para obtener una ruta mediante la API de CalculateRoutes y, a continuación, la visualizará en un mapa estático mediante GeoJSON y un estilo personalizado para puntos y líneas.
## Pasos para agregar una ruta
1. Obtenga rutas desde la API de `CalculateRoutes`. Elimine las coordenadas que estén en la misma línea recta para optimizar LineString y evitar que la cadena de consulta alcance su límite.
1. Cree un objeto GeoJSON basado en el conjunto de coordenadas optimizado.
1. Tome el primer y el último punto del LineString y agregue geometrías de puntos para marcar las ubicaciones inicial y final.
1. Diseñe los puntos y el LineString de acuerdo con las necesidades de la empresa, ajustando propiedades como el color, el tamaño y las etiquetas.
## Agregación de una ruta con un estilo compacto
En este ejemplo, agregará una ruta con puntos de inicio y final a la línea creada en [Cómo agregar una línea a un mapa estático](how-to-add-line-static.md). La ruta se definirá con un estilo personalizado, que incluirá el color, el tamaño y las etiquetas de los puntos inicial y final.
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "LineString",
"coordinates": [
[-123.11813, 49.28246],
[-123.11967, 49.28347],
[-123.12108, 49.28439],
[-123.12216, 49.28507],
[-123.12688, 49.28812],
[-123.1292, 49.28964],
[-123.13216, 49.2916],
[-123.13424, 49.29291],
[-123.13649, 49.2944],
[-123.13678, 49.29477],
[-123.13649, 49.29569],
[-123.13657, 49.29649],
[-123.13701, 49.29715],
[-123.13584, 49.29847],
[-123.13579, 49.29935],
[-123.13576, 49.30018],
[-123.13574, 49.30097]
]
},
"properties": {
"color": "#000000",
"width": "20m",
"outline-color": "#a8b9cc",
"outline-width": "2px"
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-123.11813, 49.28246]
},
"properties": {
"label": "Pacific Centre",
"icon": "bubble",
"size": "large",
"color": "#34B3A4",
"outline-color": "#006400",
"text-color": "#FFFFFF"
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-123.13574, 49.30097]
},
"properties": {
"label": "Stanley Park",
"icon": "bubble",
"size": "large",
"color": "#B3346D",
"outline-color": "#FF0000",
"text-color": "#FFFFFF"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=200&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22type%22%3A%22LineString%22,%22coordinates%22%3A%5B%5B-123.11813,49.28246%5D,%5B-123.11967,49.28347%5D,%5B-123.12108,49.28439%5D,%5B-123.12216,49.28507%5D,%5B-123.12688,49.28812%5D,%5B-123.1292,49.28964%5D,%5B-123.13216,49.2916%5D,%5B-123.13424,49.29291%5D,%5B-123.13649,49.2944%5D,%5B-123.13678,49.29477%5D,%5B-123.13649,49.29569%5D,%5B-123.13657,49.29649%5D,%5B-123.13701,49.29715%5D,%5B-123.13584,49.29847%5D,%5B-123.13579,49.29935%5D,%5B-123.13576,49.30018%5D,%5B-123.13574,49.30097%5D%5D%7D,%22properties%22%3A%7B%22color%22%3A%22%23000000%22,%22width%22%3A%2220m%22,%22outline-color%22%3A%22%23a8b9cc%22,%22outline-width%22%3A%222px%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%22Point%22,%22coordinates%22%3A%5B-123.11813,49.28246%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Pacific%20Centre%22,%22icon%22%3A%22bubble%22,%22size%22%3A%22large%22,%22color%22%3A%22%2334B3A4%22,%22outline-color%22%3A%22%23006400%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D,%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%22Point%22,%22coordinates%22%3A%5B-123.13574,49.30097%5D%7D,%22properties%22%3A%7B%22label%22%3A%22Stanley%20park%22,%22icon%22%3A%22bubble%22,%22size%22%3A%22large%22,%22color%22%3A%22%23B3346D%22,%22outline-color%22%3A%22%23FF0000%22,%22text-color%22%3A%22%23FFFFFF%22%7D%7D%5D%7D&key=API_KEY
```
------
#### [ Response image ]
![\[Aerial view of Vancouver with Stanley Park and Pacific Centre marked, showing urban layout and coastline.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/static-add-route-compact.png)
------
# Cómo agregar un polígono a un mapa estático
Los edificios y las ubicaciones se pueden resaltar en un mapa designando un polígono a su alrededor, por ejemplo, el Pentágono (ubicado en Washington, D.C.).
## Agregación de un único polígono
En este ejemplo, se agrega un polígono (un pentágono) para el edificio del Pentágono en el mapa.
------
#### [ Geo JSON ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"coordinates": [
[
[
-77.0579282196337,
38.87264268371487
],
[
-77.05868880963534,
38.87003145971428
],
[
-77.05560979468949,
38.86876862025221
],
[
-77.05305311263672,
38.87059509268525
],
[
-77.0546384387842,
38.872985132206225
],
[
-77.0579282196337,
38.87264268371487
]
]
],
"type": "Polygon"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=600&height=1024&padding=200&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22coordinates%22%3A%5B%5B%5B-77.0579282196337,38.87264268371487%5D,%5B-77.05868880963534,38.87003145971428%5D,%5B-77.05560979468949,38.86876862025221%5D,%5B-77.05305311263672,38.87059509268525%5D,%5B-77.0546384387842,38.872985132206225%5D,%5B-77.0579282196337,38.87264268371487%5D%5D%5D,%22type%22%3A%22Polygon%22%7D%7D%5D%7D&key=your_API_Key
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra un polígono alrededor del Pentágono.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/addPolygonStaticMap.png)
------
## Agregación de un polígono de estilo
En este ejemplo, rediseñamos el polígono que se muestra en el ejemplo anterior. Dibujamos el polígono en un color diferente (**n.º E3F70550**). A continuación, explicamos los componentes del color.
+ **E3** representa el componente rojo.
+ **F7** representa el componente verde.
+ **05** representa el componente azul.
+ **50** representa el componente alfa (opacidad).
------
#### [ Geo JSON ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"coordinates": [
[
[
-77.0579282196337,
38.87264268371487
],
[
-77.05868880963534,
38.87003145971428
],
[
-77.05560979468949,
38.86876862025221
],
[
-77.05305311263672,
38.87059509268525
],
[
-77.0546384387842,
38.872985132206225
],
[
-77.0579282196337,
38.87264268371487
]
]
],
"type": "Polygon"
},
"properties": {
"color": "#E3F70550"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=100&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22geometry%22%3A%7B%22coordinates%22%3A%5B%5B%5B-77.0579282196337,38.87264268371487%5D,%5B-77.05868880963534,38.87003145971428%5D,%5B-77.05560979468949,38.86876862025221%5D,%5B-77.05305311263672,38.87059509268525%5D,%5B-77.0546384387842,38.872985132206225%5D,%5B-77.0579282196337,38.87264268371487%5D%5D%5D,%22type%22%3A%22Polygon%22%7D,%22properties%22%3A%7B%22color%22%3A%22%23E3F70550%22%7D%7D%5D%7D&key=your_API_Key
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra un polígono de color diferente alrededor del Pentágono.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/addPolygonStaticMap-color.png)
------
## Agregación de varios polígonos
En este ejemplo, agregamos varios polígonos para resaltar varios parques de la ciudad de Nueva York.
------
#### [ Geo JSON ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"properties": {
"color": "#00800050"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-73.95824708489555,
40.80055774655358
],
[
-73.9818875523859,
40.76810261850716
],
[
-73.9729556303776,
40.7642422333698
],
[
-73.94916953372382,
40.79699323614054
],
[
-73.95824708489555,
40.80055774655358
]
]
]
}
},
{
"type": "Feature",
"properties": {
"color": "#FF000050"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-73.94432602794981,
40.80634757577718
],
[
-73.94607200977896,
40.803869579741644
],
[
-73.94301654157768,
40.80263972513214
],
[
-73.94127055974795,
40.805099411561145
],
[
-73.94432602794981,
40.80634757577718
]
]
]
}
},
{
"type": "Feature",
"properties": {
"color": "#0000FF50"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-73.9947948382843,
40.7691390468232
],
[
-73.99564708262241,
40.76802192177411
],
[
-73.99372953286147,
40.76723992306512
],
[
-73.99289367783732,
40.76835706126087
],
[
-73.9947948382843,
40.7691390468232
]
]
]
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map?style=Satellite&width=1024&height=1024&padding=100&scale-unit=KilometersMiles&geojson-overlay=%7B%22type%22%3A%22FeatureCollection%22,%22features%22%3A%5B%7B%22type%22%3A%22Feature%22,%22properties%22%3A%7B%22color%22%3A%22%2300800050%22%7D,%22geometry%22%3A%7B%22type%22%3A%22Polygon%22,%22coordinates%22%3A%5B%5B%5B-73.95824708489555,40.80055774655358%5D,%5B-73.9818875523859,40.76810261850716%5D,%5B-73.9729556303776,40.7642422333698%5D,%5B-73.94916953372382,40.79699323614054%5D,%5B-73.95824708489555,40.80055774655358%5D%5D%5D%7D%7D,%7B%22type%22%3A%22Feature%22,%22properties%22%3A%7B%22color%22%3A%22%23FF000050%22%7D,%22geometry%22%3A%7B%22type%22%3A%22Polygon%22,%22coordinates%22%3A%5B%5B%5B-73.94432602794981,40.80634757577718%5D,%5B-73.94607200977896,40.803869579741644%5D,%5B-73.94301654157768,40.80263972513214%5D,%5B-73.94127055974795,40.805099411561145%5D,%5B-73.94432602794981,40.80634757577718%5D%5D%5D%7D%7D,%7B%22type%22%3A%22Feature%22,%22properties%22%3A%7B%22color%22%3A%22%230000FF50%22%7D,%22geometry%22%3A%7B%22type%22%3A%22Polygon%22,%22coordinates%22%3A%5B%5B%5B-73.9947948382843,40.7691390468232%5D,%5B-73.99564708262241,40.76802192177411%5D,%5B-73.99372953286147,40.76723992306512%5D,%5B-73.99289367783732,40.76835706126087%5D,%5B-73.9947948382843,40.7691390468232%5D%5D%5D%7D%7D%5D%7D&key=your_API_Key
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra varios polígonos alrededor de los parques de Nueva York.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/addPolygonStaticMap-multiple.png)
------
# Cómo configurar el idioma de los mapas estáticos
Puede configurar el idioma de un mapa estático, en caso de que no desee utilizar el idioma predeterminado.
En este ejemplo, se solicita en inglés una ubicación de Tokio que normalmente utiliza texto en japonés de forma predeterminada, lo que sobrescribe el valor predeterminado regional.
El ejemplo muestra la imagen de respuesta de una solicitud en la que se proporciona el idioma y otra en la que no se proporciona el idioma. Las etiquetas correspondientes reflejan la diferencia entre un mapa que muestra el idioma solicitado y un mapa que muestra el idioma predeterminado.
------
#### [ Request URL - English set as the language ]
```
https://maps.geo.us-east-1.amazonaws.com/v2/static/map?center=139.4575,35.539&style=Standard&lang=en&height=700&width=700&zoom=14
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra un polígono alrededor del Pentágono.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/setLanguageEnglishStaticMap.png)
------
------
#### [ Request URL - default language ]
```
https://maps.geo.us-east-1.amazonaws.com/v2/static/map?center=139.4575,35.539&style=Standard&height=700&width=700&zoom=14
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra un polígono alrededor del Pentágono.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/setLanguageDefaultStaticMap.png)
------
# Cómo agregar un círculo de proximidad a un mapa estático
Los círculos de proximidad ofrecen información importante sobre la precisión de la ubicación de un dispositivo o usuario notificada o estimada. Al mostrar un círculo alrededor del punto indicado, se informa a los usuarios de que la posición real podría situarse en cualquier punto del círculo, debido a diversos factores que afectan a la precisión del posicionamiento. Esta mayor claridad ayuda a la toma de decisiones y mejora la seguridad de la navegación.
En este ejemplo, se agrega un círculo de proximidad de 500 metros cerca de la Torre Eiffel de París.
------
#### [ Request ]
```
{
"type": "FeatureCollection",
"features": [
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
2.298151,
48.855921
]
},
"properties": {
"style": "circle",
"color": "#007BFF50",
"width": "500m"
}
},
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [
2.298151,
48.855921
]
},
"properties": {
"icon": "cp",
"color": "#007BFF",
"text-color":"#DC3545",
"text-outline-color":"#007BFF",
"outline-width":"20px",
"label": "You are here",
"size": "large"
}
}
]
}
```
------
#### [ Request URL ]
```
https://maps.geo.eu-central-1.amazonaws.com/v2/static/map@2x?style=Satellite&width=700&height=700&zoom=17¢er=2.2958,48.8570&geojson-overlay=%7B%20%20%22type%22%3A%20%22FeatureCollection%22,%20%20%22features%22%3A%20%5B%20%20%20%20%7B%20%20%20%20%20%20%22type%22%3A%20%22Feature%22,%20%20%20%20%20%20%22geometry%22%3A%20%7B%20%20%20%20%20%20%20%20%22type%22%3A%20%22Point%22,%20%20%20%20%20%20%20%20%22coordinates%22%3A%20%5B%20%20%20%20%20%20%20%20%20%202.298151,%20%20%20%20%20%20%20%20%20%2048.855921%20%20%20%20%20%20%20%20%5D%20%20%20%20%20%20%7D,%20%20%20%20%20%20%22properties%22%3A%20%7B%20%20%20%20%20%20%20%20%22style%22%3A%20%22circle%22,%20%20%20%20%20%20%20%20%22color%22%3A%20%22%23007BFF50%22,%20%20%20%20%20%20%20%20%22width%22%3A%20%22500m%22%20%20%20%20%20%20%7D%20%20%20%20%7D,%20%20%20%20%7B%20%20%20%20%20%20%22type%22%3A%20%22Feature%22,%20%20%20%20%20%20%22geometry%22%3A%20%7B%20%20%20%20%20%20%20%20%22type%22%3A%20%22Point%22,%20%20%20%20%20%20%20%20%22coordinates%22%3A%20%5B%20%20%20%20%20%20%20%20%20%202.298151,%20%20%20%20%20%20%20%20%20%2048.855921%20%20%20%20%20%20%20%20%5D%20%20%20%20%20%20%7D,%20%20%20%20%20%20%22properties%22%3A%20%7B%20%20%20%20%20%20%20%20%22icon%22%3A%20%22cp%22,%20%20%20%20%20%20%20%20%22color%22%3A%20%22%23007BFF%22,%20%20%20%20%20%20%20%20%22text-color%22%3A%22%23DC3545%22,%20%20%20%20%20%20%20%20%22text-outline-color%22%3A%22%23007BFF%22,%20%20%20%20%20%20%20%20%22outline-width%22%3A%2220px%22,%20%20%20%20%20%20%20%20%22label%22%3A%20%22You%20are%20here%22,%20%20%20%20%20%20%20%20%22size%22%3A%20%22large%22%20%20%20%20%20%20%7D%20%20%20%20%7D%20%20%5D%7D&key=your_API_Key
```
------
#### [ Response image ]
![\[Mapa de ejemplo que muestra un círculo de proximidad alrededor de la Torre Eiffel.\]](http://docs.aws.amazon.com/es_es/location/latest/developerguide/images/mapsV2/addPproximityCircleStaticMap.png)
------