Mapa (mobile)

Mapa (mobile)

Função

O mapa, é um componente estático que aceita links incorporados de sites como o Google Maps e Bing Maps. Para buscas em mapas de forma dinâmica, acesse nossa documentação Usando a API do Google Maps em seu projeto.

Figura 1 : Componente Mapa rodando no celular com o link do Google Maps

Principais propriedades

Na tabela abaixo estão descritas as principais propriedades para o funcionamento básico do componente Mapa.

Nome

Propriedade

Função

Nome

Propriedade

Função

Link incorporado

src

Especifica o caminho da URL do mapa que será incorporado na aplicação.

Largura do mapa

width

Atributo que especifica a largura do componente.

Altura do mapa

height

Atributo que especifica a altura do componente em px.

Identificador

id

Atributo que especifica um ID exclusivo para o componente. Por padrão um id é gerado automaticamente e atribuído ao componente.

Estilo

style

Altera o estilo do componente da forma inline.

Exibir

ng-show

Propriedade Cronapp MVC usada para exibir ou oculta o componente.

Repetir

crn-repeat

Propriedade que seleciona uma fonte de dados contida na tela e repete o componente baseado no número de itens dessa fonte de dados.

Segurança

cronapp-security

Propriedade do Cronapp que trata as permissões de segurança da aplicação. Usado para permitir ou não edição e visualização do componente com base nos perfis selecionados.

Skin

crn-skin

Permite selecionar um skin que afetará apenas o componente selecionado.

Classes CSS

class

Adiciona classes CSS que já foram criadas.

Link incorporado

Para renderizar o mapa é necessário obter o endereço incorporado, disponibilizado no site de mapas da preferência do usuário. No exemplo da figura 2, utilizaremos a plataforma Google Maps. Esse link é obtido ao clicar em Compartilhar (1) > Incorporar um mapa (2) > Copiar HTML (3) > atributo src do HTML (4). Após seguir esses passos, cole o código no campo da propriedade Link incorporado (src), no editor de view.

Figura 2 : Obtendo o link incorporado.

Nome em inglês

Map


Nessa página


Compatibilidade

  • Formulário mobile


Equivalente web

Não possui.


Botão do componente


Imagem no editor visual