Compartir vía

Dibujar e insertar formas en un mapa (versión preliminar)

  • Artículo

[Este tema es documentación preliminar y está sujeto a modificaciones.]

Agregue un panel de dibujo a sus mapas para permitir que los usuarios dibujen y etiqueten formas en ellos. También puede insertar y etiquetar formas predefinidas para resaltar regiones específicas o áreas de interés.

Captura de pantalla de un control Mapa con ejemplos de formas dibujadas y etiquetadas.

Importante

  • Esta es una característica en vista previa.
  • Las vistas previas de características no se han diseñado para un uso de producción y pueden tener una funcionalidad restringida. Estas características están disponibles antes del lanzamiento oficial para que los clientes puedan tener un acceso anticipado y proporcionar comentarios.

Requisitos previos

  1. Cree una aplicación de lienzo y asegúrese de que cumpla con los Requisitos previos geoespaciales.
  2. Insertar un mapa.

Dibujar y etiquetar formas en un mapa interactivo

  1. En el panel Propiedades del control Mapa, active las siguientes propiedades:

    • (Versión preliminar) Habilitar el dibujo de formas

    • (Versión preliminar) Habilitar la eliminación de formas y la edición de etiquetas

      Captura de pantalla del panel Propiedades de un control Mapa, que muestra las propiedades de Dibujo de formas activadas.

    Aparece un panel de dibujo en la esquina superior izquierda del control Mapa.

    Captura de pantalla de un control Mapa en una aplicación de lienzo con el panel de dibujo resaltado.

    El panel cuenta con tres herramientas:

    • Una herramienta de dibujo de polígonos para dibujar formas de forma libre
    • Una herramienta de dibujo cuadrado para dibujar cuadrados y rectángulos
    • Una herramienta de dibujo de círculos para dibujar círculos y óvalos

  2. Seleccione una herramienta y dibuje una forma en el mapa. Para finalizar y cerrar una forma libre, haga doble clic en el punto final.

Las formas dibujadas se etiquetan automáticamente. Para cambiar una etiqueta, seleccione la forma y luego ingrese un nuevo nombre en el cuadro en la esquina superior derecha del mapa.

Para eliminar una forma, selecciónela y luego seleccione la papelera.

Captura de pantalla de un control Mapa con formas y etiquetas de ejemplo, con el icono de la papelera y el cuadro de etiquetas resaltados

Importar formas GeoJSON en un mapa

Si ya tiene formas definidas con formato GeoJSON, puede importarlas en el mapa. Por ejemplo, puede tener una forma que defina un área específica que desee resaltar.

La cadena GeoJSON para cada forma en el origen de datos debe estar en el formato correcto, en una sola celda.

Para importar formas, primero conecte el origen de datos al control Mapa. A continuación, asigne las propiedades del control a las columnas correspondientes en origen de datos, como en el siguiente ejemplo:

Una captura de pantalla de las propiedades avanzadas de un control Mapa, con los campos de origen de datos proporcionados y las formas resultantes mostradas en el mapa.

El origen de datos debe ser una tabla con nombre con al menos tres columnas. Cada columna corresponde a una propiedad avanzada del control Mapa.

Descripción de columna Corresponde con Obligatorio
Las coordenadas GeoJSON de la forma en el formato correcto Objetos GeoJSON de forma Obligatorio
Etiqueta de la forma Etiquetas de forma Opcionales
Color de la forma Colores de forma Opcionales

Sugerencia

Especifique el color usando un nombre, definición de color de CSS o valor RGBA. Si no se proporciona el color, la forma utilizará los valores predeterminados de la aplicación.

Se debe dar un nombre al origen de datos. Si usa un libro de Excel como origen de datos, use el nombre de la tabla que contiene los datos. En este ejemplo, importaremos formas desde una tabla de Excel llamada Seattle1.

Una captura de pantalla de una tabla en Excel con datos de formas GeoJSON.

  1. Copie los siguientes datos de ejemplo en un libro de trabajo en blanco, formatéelo como una tabla y asigne el nombre a la tabla Seattle1. Luego, conecte el libro de trabajo a su mapa como origen de datos. Para obtener instrucciones detalladas utilizando un ejemplo similar, consulte Usar un origen de datos para colocar marcadores en un mapa.

    Provincia GeoJSON TotalCases Color
    Adams {"type":"FeatureCollection","properties":{"kind":"state","state":"WA"},"features":[{"type":"Feature","properties":{"kind":"county","name":"Adams","state":"WA"},"geometry":{"type":"MultiPolygon","coordinates":[[[[-118.9503,47.2640],[-117.9590,47.2586],[-117.9699,46.8697],[-118.0466,46.7711],[-118.2109,46.7383],[-119.2132,46.7383],[-119.3720,46.7383],[-119.3665,46.9135],[-118.9832,46.9135],[-118.9777,47.2640]]]]}}]} 1689 RGB(184,210,232)
    Asotin {"type":"FeatureCollection","properties":{"kind":"state","state":"WA"},"features":[{"type":"Feature","properties":{"kind":"county","name":"Asotin","state":"WA"},"geometry":{"type":"MultiPolygon","coordinates":[[[[-117.0388,46.4261],[-117.0607,46.3549],[-116.9841,46.2946],[-116.9676,46.2015],[-116.9238,46.1687],[-116.9841,46.0920],[-116.9183,45.9934],[-117.4825,45.9989],[-117.4825,46.1194],[-117.4222,46.1194],[-117.4222,46.3823],[-117.2305,46.4096],[-117.2305,46.4644],[-117.1977,46.4206]]]]}}]} 1096 RGB(184,210,232)
    Benton {"type":"FeatureCollection","properties":{"kind":"state","state":"WA"},"features":[{"type":"Feature","properties":{"kind":"county","name":"Benton","state":"WA"},"geometry":{"type":"MultiPolygon","coordinates":[[[[-119.8759,46.6287],[-119.6240,46.6452],[-119.5144,46.7273],[-119.4542,46.6780],[-119.2680,46.5192],[-119.2680,46.2727],[-119.0434,46.1906],[-118.9448,46.0756],[-118.9393,46.0263],[-118.9886,45.9989],[-119.1256,45.9332],[-119.4323,45.9167],[-119.5692,45.9277],[-119.6678,45.8565],[-119.8704,45.8346],[-119.8649,46.0427],[-119.8759,46.6287]]]]}}]} 13111 RGB(13,106,191)
    Chelan {"type":"FeatureCollection","properties":{"kind":"state","state":"WA"},"features":[{"type":"Feature","properties":{"kind":"county","name":"Chelan","state":"WA"},"geometry":{"type":"MultiPolygon","coordinates":[[[[-120.7029,48.5292],[-120.6536,48.5347],[-120.6262,48.4964],[-120.6646,48.4471],[-120.6481,48.3978],[-120.5605,48.3704],[-120.5879,48.3211],[-120.5112,48.3101],[-120.3524,48.2170],[-120.3633,48.1568],[-120.3250,48.1294],[-120.1443,48.0637],[-120.1443,48.0363],[-120.0895,48.0199],[-120.0512,47.9596],[-119.8704,47.9596],[-119.9964,47.7789],[-120.2100,47.7515],[-120.1990,47.6803],[-120.2374,47.5872],[-120.3031,47.5215],[-120.3195,47.4557],[-120.2921,47.4010],[-120.0895,47.3407],[-120.0950,47.2640],[-120.3907,47.2586],[-120.5276,47.3352],[-120.5605,47.3079],[-120.8015,47.4229],[-120.9165,47.4284],[-121.1137,47.5981],[-121.1301,47.6748],[-121.0644,47.7132],[-121.1192,47.7789],[-121.0699,47.8282],[-121.1520,47.8446],[-121.1739,47.8884],[-121.1630,47.9541],[-121.1192,47.9980],[-121.1520,48.0418],[-121.0151,48.0746],[-120.9439,48.1130],[-120.9548,48.1513],[-120.9056,48.1623],[-121.0041,48.2937],[-121.0699,48.3156],[-121.0425,48.3485],[-121.0644,48.3923],[-121.0370,48.4306],[-121.0480,48.4854],[-120.8563,48.5511],[-120.7851,48.5073]]]]}}]} 5324 RGB(112,187,255)

  2. Enlace las siguientes propiedades avanzadas del control Mapa a las columnas correspondientes en el origen de datos:

    Propiedad Columna
    Objetos GeoJSON de forma GeoJSON
    Etiquetas de forma Provincia
    Colores de forma Color

    El mapa deberá ser similar a este:

    Captura de pantalla de un mapa con formas importadas que resaltan áreas específicas.

Mostrar el perímetro y el área de formas dibujadas o insertadas (versión preliminar)

Las aplicaciones pueden mostrar el perímetro (en pies) y el área (en pies cuadrados) de una forma seleccionada en un mapa.

  1. En la aplicación, abra la pestaña Insertar y expanda Mostrar.
  2. Seleccione Etiqueta de texto para insertar una etiqueta en la pantalla de la aplicación. Muévalo y cambie su tamaño como quiera.
  3. Cambie la propiedad Texto del control label a [Map].SelectedShape.Area o [Map].SelectedShape.Perimeter para mostrar el área o el perímetro de la forma seleccionada. (Sugerencia: Ingrese el valor dado en la barra de fórmulas o en la pestaña Propiedades, lo que prefiera).

En el siguiente ejemplo hemos utilizado cuatro etiquetas de texto para mostrar tanto el área como el perímetro de la forma seleccionada.

Captura de pantalla de una forma seleccionada en un mapa, junto a dos etiquetas de texto que muestran el área y el perímetro de la forma.

Otras características interactivas del mapa

Otros controles geoespaciales

Para ver sugerencias de dirección dinámicas mientras escribe, use el control Entrada de dirección.

Nota

¿Puede indicarnos sus preferencias de idioma de documentación? Realice una breve encuesta. (tenga en cuenta que esta encuesta está en inglés)

La encuesta durará unos siete minutos. No se recopilan datos personales (declaración de privacidad).