Central de Ajuda do Scribble Maps
Alterar idioma

Adicione o ScribbleMaps ao seu aplicativo

Nota:
Use o ScribbleMaps Connect Picker quando quiser que os usuários façam login no Scribble Maps, naveguem pelos mapas disponíveis e retornem os dados do mapa diretamente para o seu aplicativo web.
 
O seletor abre em um pop-up e lida com o processo de login do usuário lá, para que seu aplicativo não precise coletar credenciais do Scribble Maps diretamente.

Conteúdo

 
 

Como o Connect Picker funciona

O ScribbleMaps Connect Picker permite que seus usuários naveguem, pesquisem e selecionem mapas do Scribble Maps, e então retornem esses dados de mapa diretamente para o seu aplicativo no formato que você escolher.

Isso é útil quando você deseja que os usuários criem ou gerenciem geodados no Scribble Maps e depois carreguem esses dados em seu próprio aplicativo sem precisar criar seu próprio navegador de mapas ou fluxo de login.

Caso de Uso / Exemplo:

Esta integração é útil para painéis, ferramentas imobiliárias, aplicativos de dados de campo e outros aplicativos web que precisam que os usuários selecionem e carreguem dados mapeados do Scribble Maps.

Ver Conteúdo ↑

 
 

Obtenha seu Client ID

  1. Abra o site de desenvolvedores do Scribble Maps:
    https://developers.scribblemaps.com

     
  2. Registre um projeto gratuito.

     
  3. Copie seu Client ID.

    Você usará este valor ao chamar o Connect Picker.

Ver Conteúdo ↑

 
 

Adicione o SDK à sua página

  1. Na sua página web, adicione o SDK do Connect Picker:

    <script src="https://api.scribblemaps.com/connect/picker.js"></script>
     
  2. Salve as alterações da sua página.

    O Scribble Maps Connect Picker agora está disponível para o seu aplicativo.

Ver Conteúdo ↑

 
 

Abra o Connect Picker

  1. Chame ScribbleMapsConnect.pick() a partir da sua página.

     
  2. Passe seu clientId, o format de exportação desejado e um callback onSelect.

     
  3. Use um código semelhante ao seguinte exemplo:

    ScribbleMapsConnect.pick({
      clientId: 'YOUR_CLIENT_ID',
      format: 'geojson',
      onSelect: function (result) {
        // result.data contains your GeoJSON
        // result.title, result.mapCode, result.thumbUrl also available
        loadIntoMyApp(result.data);
      }
    });
    Quando o seletor abrir, o usuário poderá se autenticar, navegar pelos mapas disponíveis e selecionar um.

Ver Conteúdo ↑

 
 

Trate os dados do mapa selecionado

  1. No callback onSelect, acesse result.data.

    Isso contém os dados do mapa no formato solicitado.
     
  2. (Opcional) Use os campos adicionais retornados:

    • result.title — o título do mapa
    • result.mapCode — o código do mapa do Scribble Maps
    • result.thumbUrl — uma URL de miniatura para o mapa
     
  3. Passe os dados para a lógica do seu aplicativo.

    Por exemplo, carregue o GeoJSON retornado em seu próprio visualizador de mapas ou fluxo de trabalho de dados.

Ver Conteúdo ↑

 
 

Configuração opcional

Você pode configurar o seletor para se adequar melhor ao fluxo de trabalho do seu aplicativo.

  1. Selecione o formato de exportação alterando o valor de format.

    Por exemplo: geojson, kml, csv, gpx, dxf, shapefile ou smjson.
     
  2. Escolha quais fontes de mapa os usuários podem navegar com a opção tabs.

    Os usuários podem navegar por mapas de sua biblioteca pessoal, mapas compartilhados com a equipe ou da coleção da comunidade.
     
  3. (Opcional) Use os estilos de botão incluídos para combinar com uma interface clara ou escura.

Ver Conteúdo ↑

 
 

Formatos suportados e campos retornados

Formatos de exportação suportados:
  • GeoJSON
  • KML
  • CSV
  • GPX
  • DXF
  • Shapefile
  • SMJSON
Campos de resultado retornados:
  • data
  • title
  • mapCode
  • thumbUrl

Depois de configurado, o Connect Picker oferece aos seus usuários acesso aos dados do Scribble Maps diretamente de dentro do seu aplicativo por meio de um único ponto de integração.

 
 

Relacionado

Scribble Maps Developers

Scribble Maps Connect Picker

Importar/Exportar Arquivos e Dados - GeoJSON, imagens, PDF, CSV, KML, GXP, SHP, DXF, SMJSON, SMT, WKT, etc.

Importar/Exportar: Descrições, Exemplos, Restrições e Soluções Alternativas - CSV, DXF, GeoJSON, GPX, KML, KMZ, SHP

 
 

Última atualização