IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

SIG : Système d'information Géographique Discussion :

Leaflet sur symfony2 et Twig


Sujet :

SIG : Système d'information Géographique

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre du Club
    Homme Profil pro
    Conseil en assistance à maîtrise d'ouvrage
    Inscrit en
    Juin 2014
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Conseil en assistance à maîtrise d'ouvrage
    Secteur : Agroalimentaire - Agriculture

    Informations forums :
    Inscription : Juin 2014
    Messages : 7
    Par défaut Leaflet sur symfony2 et Twig
    Bonjour,


    J'ai une application symfony 2 avec des données géoréférencées, lat + lon et je voudrais en avoir une cartographie.
    Pour simplifier, on peut commencer avec la base, l'exemple de http://leafletjs.com/examples/quick-start.html

    dans base.html.twig j'ai :

    {% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('css/bootstrap.css') }}" type="text/css" />
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" />

    {% endblock %}
    {% block javascripts %}
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> </script>
    <script type="text/javascript" src="{{ asset('js/bootstrap.js') }}"> </script>
    <script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
    {% endblock %}

    dans la vue index.html.twig j'ai :
    {% block map %}

    <div id="map_canvas" class="map" style="height:250px" >
    <script type="text/javascript">
    //carte centrée au sud Niger
    var map = L.map('map_canvas').setView([13.3, 3.05], 7);
    var marker{0} = L.marker([{13.5}, {3.5}]).addTo(map);
    marker{0}.bindPopup("texte");
    </script>
    </div>

    Je remplirai des variables dans le controleur, plus tard.


    Et ... rien ... nada ...

    qu'est-ce qui peut me manquer ?????

    D'avance merci !

  2. #2
    Membre du Club
    Homme Profil pro
    Conseil en assistance à maîtrise d'ouvrage
    Inscrit en
    Juin 2014
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Conseil en assistance à maîtrise d'ouvrage
    Secteur : Agroalimentaire - Agriculture

    Informations forums :
    Inscription : Juin 2014
    Messages : 7
    Par défaut
    Avec le ivory googlemap bundle
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
     new Ivory\GoogleMapBundle\IvoryGoogleMapBundle(),
    Il suffit de mettre ce code dans index.html.twig
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
     {% block map %}
    
       
              {{ google_map_css(map) }}
              {{ google_map_container(map) }}
              {{ google_map_js(map) }}       
        
         </script>
        <div id="map_canvas" class="map" style="height:250px" >   
       </div>
        
         {% endblock %}

    et dans base.html.twig
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    {% block javascripts %}
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">			</script>
    De remplir les variables dans le controlleur ( je laisse les options en commentaires, je continue mes tests)

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    <?php
    
    namespace Luc\StatBundle\Controller;
    
    use Symfony\Component\HttpFoundation\Request;
    use Symfony\Bundle\FrameworkBundle\Controller\Controller;
    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Method;
    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Template;
    use Luc\StatBundle\Entity\Budget;
    use Luc\StatBundle\Form\BudgetType;
    
    use Ivory\GoogleMap\Map;
    use Ivory\GoogleMap\MapTypeId;
    use Ivory\GoogleMap\Controls\ControlPosition;
    use Ivory\GoogleMap\Controls\PanControl;
    use Ivory\GoogleMap\Overlays\Animation;
    use Ivory\GoogleMap\Overlays\Marker;
    use Ivory\GoogleMap\Controls\ZoomControl;
    use Ivory\GoogleMap\Events\MouseEvent;
    use Ivory\GoogleMap\Overlays\InfoWindow;
    
    /**
     * Budget controller.
     *
     * @Route("/budget")
     */
    class BudgetController extends Controller
    {
    
        /**
         * Lists all Budget entities.
         *
         * @Route("/", name="budget")
         * @Method("GET")
         * @Template()
         */
        public function indexAction()
        {
            $em = $this->getDoctrine()->getManager();
    
            $entities = $em->getRepository('LucStatBundle:Budget')->findAll();   
            
           
            //
           $map = new Map();
           $map->setPrefixJavascriptVariable('map_');
            $map->setHtmlContainerId('map_canvas');
            //$map->setAsync(false);
            // Disable the auto zoom flag
            $map->setAutoZoom(false);
            // Sets the center
            $map->setCenter(13.363, 3.009, true);
            // Sets the zoom
            $map->setMapOption('zoom', 8);  
            //Set the type  
            //$map->setMapOption('mapTypeId', 'roadmap');
            $map->setStylesheetOption('width', '800px');
            //$map->setStylesheetOption('height', '300px');
            $map->setLanguage('fr');
            
            
            // Markers
            $marker = new Marker();
            // Configure your marker options
            //$marker->setPrefixJavascriptVariable('marker_');
            $marker->setPosition(13.363, 3.1090, true);
            //$marker->setAnimation(Animation::DROP);
            //$marker->setAnimation('bounce');
            //$marker->setOption('clickable', false);
            //$marker->setOption('clickable', true);
            //$marker->setOption('flat', true);
            /*$marker->setOptions(array(
                'clickable' => false,
                'flat'      => true,
                ));
            */
            
            //ajouter une fenetre d'info sur le marker
                $infoWindow = new InfoWindow();
                $infoWindow->setPrefixJavascriptVariable('info_window_');
                $infoWindow->setPosition(0, 0, true);
                $infoWindow->setPixelOffset(1.1, 2.1, 'px', 'pt');
                $infoWindow->setContent('<p>Voici le contenu</p>');
                $infoWindow->setOpen(false);
                //$infoWindow->setAutoOpen(true);
                $infoWindow->setOpenEvent(MouseEvent::CLICK);
                $infoWindow->setAutoClose(true);
                $infoWindow->setOption('disableAutoPan', true);
                $infoWindow->setOption('zIndex', 10);
                /*$infoWindow->setOptions(array(
                    'disableAutoPan' => true,
                    'zIndex'         => 10,
                        ));
                */
                //$infoWindow->setOpenEvent('click');
                $infoWindow->setOpenEvent('mouseover');
                // Add your info window to the marker
                $marker->setInfoWindow($infoWindow);
            //
            // Add your marker to the map
            $map->addMarker($marker);
            /*
            //Add your pan control to the map  
            $panControl = new PanControl();
            $map->setPanControl($panControl);
            $map->setPanControl(ControlPosition::TOP_LEFT);
        //
        $zoomControl = new ZoomControl();
        $zoomControl->setControlPosition('top_right');
        $map->setZoomControl($zoomControl);
        */
        
            return array(
                'entities' => $entities,
                'map'=> $map,
            );
        }

    Mais avec LEAFLETJS ????? Mystère .....

  3. #3
    Nouveau candidat au Club
    Homme Profil pro
    Inscrit en
    Mai 2013
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : Mai 2013
    Messages : 3
    Par défaut
    merci pour votre réponse mais est ce que tu peut nous donner la configuration et le codage que tu as fait dans(config.yml ,le controleur et le twig ) par ce que je vois que la documentation de Bundle n'est pas clair et merci

  4. #4
    Membre du Club
    Homme Profil pro
    Conseil en assistance à maîtrise d'ouvrage
    Inscrit en
    Juin 2014
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Conseil en assistance à maîtrise d'ouvrage
    Secteur : Agroalimentaire - Agriculture

    Informations forums :
    Inscription : Juin 2014
    Messages : 7
    Par défaut voici des élements de réponse
    Reçus sur l'autre fil de question.
    Bonne journée.


    youpiz vient de répondre à une discussion à laquelle vous êtes abonné :
    Forum : Symfony2 (sur Forum du club des développeurs et IT Pro)
    Intitulé de la discussion : Leaflet sur symfony et Twig

    Vous pouvez consulter le nouveau message en suivant ce lien :
    http://www.developpez.net/forums/d14...-symfony-twig/

  5. #5
    Nouveau candidat au Club
    Homme Profil pro
    Inscrit en
    Mai 2013
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : Mai 2013
    Messages : 3
    Par défaut
    @adequat.bi

    Salut une autre fois , est ce qur tu peux me dire comment vous rechargé votre map celle d'ivory google map

    et merci

  6. #6
    Nouveau candidat au Club
    Homme Profil pro
    Inscrit en
    Mai 2013
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations forums :
    Inscription : Mai 2013
    Messages : 3
    Par défaut
    dsl mon question n'est pas assez clair

    s'il vous plait j'aime bien savoir comment vous pouvez rechargé au même page la carte après que vous ajouter quelques markers au map

Discussions similaires

  1. [2.x] Votre avis sur Symfony2
    Par misterakm dans le forum Symfony
    Réponses: 197
    Dernier message: 26/06/2016, 15h05
  2. [2.x] Leaflet sur symfony et Twig
    Par adequat.bi dans le forum Symfony
    Réponses: 5
    Dernier message: 04/08/2014, 17h54
  3. [1.x] Faire le saut PHP4 vers Symfony2 et Twig ?
    Par witebs dans le forum Symfony
    Réponses: 2
    Dernier message: 06/04/2011, 17h02

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo