Git Product home page Git Product logo

leafletadianti's Introduction

Criando mapa utilizando Leaflet Maps (opensource)

Funções em php para quem quer criar mapas sem manipular o javascript.

Link Leaflet.js: https://leafletjs.com/

Instalação

Para instalar no Adianti Builder, vá na aba de "composer packages" e adicione:

andregasparin/leafletadianti

É necessário que você tenha o composer instalado.

Abra seu cmd (prompt), com o comando "cd c:/pasta/do/projeto" navegue até a raiz do seu projeto em adianti.

Execute o seguinte comando (podem variar no caso de usar linux ou mac, ex utilizar sudo no início):

composer require andregasparin/leafletadianti

Utilização

Adicione a linha no início de onde você irá utilizar: use AndreGasparin\Leafletadianti\LeafletMap;

Depois utilize a classe e insira o mapa em qualquer element que desejar, exemplo:

<?php
use AndreGasparin\Leafletadianti\LeafletMap;
 
class LeafletPage extends TPage
{
    function __construct()
    {
        parent::__construct();
        
        $map = new LeafletMap('51.505','-0.09','13', 'google'); // set initial coordinates
        $show_map = $map->show();
        
        $content = new TElement('div');
        $content->id = 'my-map';
        $content->add( $show_map );
 
        parent::add( $content );
    }
}

Exemplo de uso de todas as funções:

<?php
use AndreGasparin\Leafletadianti\LeafletMap;
 
class LeafletPage extends TPage
{
    function __construct()
    {

        $points = array();
        $points[] = ['lat' => 50.505, 'lng'=> -0.09, 'description'];  
        $points[] = ['lat' => 49.505, 'lng'=> -0.09, 'description49'];  

        $points_json = json_encode($points);

        parent::__construct();
        
        $map = new LeafletMap('51.505','-0.09','13', 'google'); // set initial coordinates
        $map->setSize('100%', '400'); //set map size  
        //$map->width = '100%';
        //$map->height = '600px';
        //$map->myLocation(true); // use gps to show and center my location, use true to display poupup with precision
        $map->addMarker('51.505', '-0.09', 'teste'); // add point on map
        $map->addJsonMarker($points_json);
        $map->center(); //center map to view all points  
	$show_map = $map->show();        

        //#Version 1.0.1
            $map->enableAddOnePoint('allPointsJson');
            $map->enableAddPoints('allPointsJson');
            //field
            $allPointsJson = new TEntry('allPointsJson');
            $allPointsJson->setSize("100%");
            parent::add( $allPointsJson );
        //#End Version 1.0.1

        //#Version 1.0.2
            $map->searchAddress('autocompleteLeaflet');
            $map = $map->show(); //create map
            //field
            $autocompleteLeaflet = new TCombo('autocompleteLeaflet');
            $autocompleteLeaflet->setSize("100%");     
            parent::add( $autocompleteLeaflet );    
        //#End Version 1.0.2

        $content = new TElement('div');
        $content->id = 'testediv';
        $content->add( $show_map );
        parent::add( $content );
    }
}

Configuração para Desenvolvimento

Caso queira implementar algo no sistema, utilize os padrões do Adianti Framework, ficaremos felizes com sua participação!

Precisa de melhoria ou ajuda com algum BUG?

Issues

Histórico (ChangeLog)

  • 1.0.0
    • Projeto criado
  • 1.0.1
    • adicionado enableAddOnePoint(RETORNO) Você pode adicionar um mapa que aceite apenas 1 marcador, o usuário tem a opção de clicar novamente no mapa e alterar o local. "Retorno" deve passar o nome do campo TEntry/THidden criado no formulário
    • adicionado enableAddPoints(RETORNO) Você pode adicionar um mapa que aceite vários marcadores, o usuário tem a opção de clicar novamente no marcador para exclui-lo. "Retorno" deve passar o nome do campo TEntry/THidden criado no formulário
  • 1.0.2
    • adicionado searchAddress(RETORNO, addMarker) Você pode adicionar uma busca de geolocation, ou seja, pesquisa por endereço. "Retorno" deve passar o nome do campo TCombo criado no formulário "addMarker" = true, ele irá inserir automaticamente um alfinete no endereço localizado
  • 1.0.3
    • pacote do composer criado
  • 1.0.4
  • 1.0.5
    • Correção de bugs

Meta

André Gasparin – [@andre-gasparin] – [email protected] / [email protected]

Distribuído sob a Licença Pública Geral GNU (GPLv3)

Contributing

  1. Faça o fork do projeto (https://https://github.com/andre-gasparin/leafletadianti/fork)
  2. Crie uma branch para sua modificação (git checkout -b feature/fooBar)
  3. Faça o commit (git commit -am 'Add some fooBar')
  4. Push (git push origin feature/fooBar)
  5. Crie um novo Pull Request

leafletadianti's People

Contributors

andre-gasparin avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.