SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

286 Plugins, 197 contribs sur SPIP-Zone, 350 visiteurs en ce moment

Accueil > Documentation > Tutoriels pour webmasters > SPIP et les API’s Google

SPIP et les API’s Google

15 mars 2010 – par Bernard Blazin

5 votes

Attention, cette contribution est EN CHANTIER : elle n’est peut-être pas fonctionnelle.

Ceci est une « contribution pédagogique », qui montre par l’exemple comment développer une nouvelle fonctionnalité pour SPIP.

Vous connaissez tous Google maps et les applications qui peuvent en découler sur SPIP ?

Mais savez-vous qu’il existe une ribambelle d’API Google applicables à SPIP.

Procédons par étapes

  • Les Google Maps
  • Les Graphes ( camemberts, courbes, histogrammes, gauges)
  • Les geo maps
  • Les gadgets

Les Google Maps

Elles présentent souvent un aspect ludique dans un site internet et bien pratique pour géolocaliser un lieu ou pour proposer un itinéraire.
L’API Google Maps est connu sous trois versions : V1, V2 (la plus utilisée) et enfin la V3 en cours de développement et qui ne nécessitera plus de clé.

Le plugin SPIP le plus connu étant GIS Escoitar

Il est bien entendu possible de faire des tas d’autres choses avec Google Maps et SPIP comme ces exemples :

Lieux intéressants

Itinéraires

Ou encore des Street Views

Accompagné d’un fichier xml, il est également possible de faire passer des tas d’informations dans les markers, les positionner, ajouter des images, du son, etc..
Couplé avec un fichier kml, on peut créer des zones de couleurs, des tracés, des cercles, des polylignes etc..

Les Graphes

Un autre API bien pratique est celui qui permet de faire des graphes dynamiques comme celui-ci :

Camembert. Cliquez un peu partout pour voir des effets intéressants. Dans cette exemple on affiche la popularité relative et absolue des dix derniers articles déposés sur le site. Il n’est pas necessaire d’avoir de grandes connaissances en javascript pour obtenir ces jolis graphiques.

<script type="text/javascript"
    src="http://www.google.com/jsapi">
   </script>
   <script type="text/javascript">
     google.load('visualization', '1',
       {packages: ['piechart']});
   </script>
   <script type="text/javascript">
     function drawVisualization() {
       // Create and populate the data table.
       var data = new google.visualization.DataTable();
       data.addColumn('string', 'titre');
       data.addColumn('number', 'popularité');
       data.addRows([
       <BOUCLE_a(ARTICLES){tous}{par date}{inverse}{0,10}> ['#TITRE',{v:#POPULARITE_ABSOLUE, f:'#POPULARITE\u00a0#TITRE'}],</BOUCLE_a>
               
         
       ]);
     
       // Create and draw the visualization.
       new google.visualization.PieChart(
         document.getElementById('visualization')).
           draw(data, {width: 400, height: 240, is3D: true, title: 'Popularité des 10 derniers textes'});  
     }
     google.setOnLoadCallback(drawVisualization);
   </script>

 </head>
 <body style="font-family: Arial; border: 0 none;">
   <div id="visualization"  style="width: 400px; height: 300px; border: 1px solid black;">
   
   </div>
       
 </body>

Un Histogramme :
exemple

Le principe est le même que pour le camembert

Géo Maps et Gadgets

D’autres exemples ( certains étant des gadgets pas toujours très utiles )
Sur la page des API’s Google

Dernière modification de cette page le 20 mars 2010

Retour en haut de la page

Répondre à cet article

Qui êtes-vous ?
  • [Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Formulaire de contact libre

    27 avril 2011 – 101 commentaires

    Dans SPIP il n’y a pas un formulaire de contact, mais autant de formulaires de contact que d’auteurs. Cette phrase de Romy, dans son article Une page de contact dans mon SPIP, pointe un petit manque de SPIP. La possibilité d’insérer rapidement (...)

  • Formidable, le générateur de formulaires

    23 janvier 2012 – 2062 commentaires

    Un générateur de formulaires facilement configurable pour les non-informaticiens et facilement extensible pour les développeurs. Introduction L’objectif était de créer un plugin permettant de générer des formulaires. Historiquement, 2 plugins (...)

  • Réservation d’événements

    16 mars 2015 – 209 commentaires

    Ce plugin permet d’offrir aux visiteurs de s’inscrire pour un évènement du plugin Agenda et de gérer les réservations enregistrées. Installation Le plugin s’installe comme n’importe quel plugin. il nécessite : Agenda API de vérification (...)

  • Court-circuit 2

    17 octobre 2011 – 61 commentaires

    Court-circuit 2 permet de rediriger certaines rubriques vers un article particulier. Vous pouvez configurer, dans l’espace privé, les règles de redirection à appliquer. Historique Court-circuit 2 est une évolution de Court-circuit 1, reprenant (...)

  • Une licence pour un article

    18 avril 2007 – 44 commentaires

    Sur une idée originale de erational, voici un plugin permettant de lier une licence à un article.