As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá. # Como adicionar uma linha a um mapa estático Neste tópico, você aprenderá a adicionar uma linha a um mapa estático usando o Amazon Location Service. Vamos abordar as opções de estilo aceitas, como definir uma linha usando GeoJSON e aplicar estilos personalizados, como cor, largura e contorno. Também vamos explorar como usar diferentes unidades de medida para propriedades como a largura da linha. ## Estilos permitidos | Nome | Tipo | Padrão | Description | | --- | --- | --- | --- | | `color` | Cor | dependente do estilo | A cor da linha. | | `width` | Inteiro/string | 2 | A largura da linha. Para obter mais informações, consulte [Como adicionar uma linha a um mapa estático](#how-to-add-line-static). | | `outline-color` | Cor | dependente do estilo | A cor de contorno da linha. | | `outline-width` | Inteiro/string | 0 (desativado) | A largura do contorno. Para obter mais informações, consulte [Como adicionar uma linha a um mapa estático](#how-to-add-line-static). | ## Unidade permitida | Unidade | Description | | --- | --- | | Inteiro, por exemplo, `5` | Pixels | | String sem unidade, por exemplo, `"5"` | Pixels | | `"px"` | Pixels | | `"m"` | Metros | | `"km"` | Quilômetros | | `"mi"` | Milhas | | `"ft"` | Pés | | `"yd"` | Jardas | | `"%"` | A porcentagem do valor padrão de uma propriedade específica, em pixels. Por exemplo, se o valor padrão para `width` for `2` pixels, então `200%` será `4` pixels. `%` é um caractere sensível, que deve ser codificado na URL da solicitação como `%25`. | ## Adicionar uma linha Neste exemplo, você adicionará uma linha de um lugar em Vancouver até o Stanley Park. A linha é criada usando um formato GeoJSON com 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 ] ![Vista de satélite da península costeira com linha vermelha marcando a rota através da área residencial e marina.](http://docs.aws.amazon.com/pt_br/location/latest/developerguide/images/static-add-line.png) ------ ## Adicionar estilo à linha Neste exemplo, você vai inserir estilo na linha adicionada do exemplo anterior. Isso inclui definir a cor, a largura, a cor do contorno e a largura do contorno da linha para personalizar a aparência visual da linha no 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 ] ![Resposta da API Static Maps mostrando uma polilinha estilizada com cor, largura e opacidade personalizadas aplicadas a uma rota costeira.](http://docs.aws.amazon.com/pt_br/location/latest/developerguide/images/static-add-line-styling.png) ------