Aller au contenu

Change
Bienvenue sur GeekZone
Inscrivez-vous sur GeekZone pour profiter des fonctions avancées du forum, proposer des news, participer aux conversations, ouvrir votre galerie, profiter de la messagerie interne et venir tester nos modérateurs avec du bon troll... Attention, ils ont la gâchette facile. C’est aussi pour ça que GeekZone est le meilleur site de passionnés depuis 2002 ! Si vous avez déjà un compte, connectez-vous - sinon, il est temps d'en créer un.

Visualisation de stats dans Google maps

- - - - -

  • Veuillez vous connecter pour répondre
6 réponses à ce sujet

#1
Miaouss

Miaouss

    Yoda Geek

  • Membre
  • PipPipPipPipPipPip
  • 3031 messages
Bon alors je me rends bien compte que ma demande fait très "Je cherche une bonne âme pour..." mais j'ai beau essayer de m'en sortir, j'y arrive pas.

La demande initiale : que je trouve une manière d'afficher des stats (que j'ai) sur une carte des communes francophones de Belgique.

En cherchant j'ai trouvé le Google Chart Tool. Mon problème c'est que je n'y comprends strictement rien. A tel point que je ne sais pas si c'est possible de l'utiliser pour travailler au niveau des communes et pas des pays. J'ai passé en revue plusieurs des liens de la page mais je comprends toujours pas plus...

Donc voilà, si quelqu'un a un peu de temps à perdre je lui serai infiniment reconnaissant pour toute info me permettant d'approcher mon but. Rien que de me dire si cet outil peut ou non travailler au niveau des communes (via code postal ou nom, peu importe) ce serait déjà super cool.

Merci d'avance,

Modifié par Miaouss, 28 November 2011 - 15:27.

.... Mais en vrai vous faites quoi comme travail ?...

#2
Micedre

Micedre

    Padawan Geek

  • Membre
  • PipPip
  • 68 messages

Voir le messageMiaouss, le 28 November 2011 - 15:26, dit :

Bon alors je me rends bien compte que ma demande fait très "Je cherche une bonne âme pour..." mais j'ai beau essayer de m'en sortir, j'y arrive pas.

La demande initiale : que je trouve une manière d'afficher des stats (que j'ai) sur une carte des communes francophones de Belgique.

En cherchant j'ai trouvé le Google Chart Tool. Mon problème c'est que je n'y comprends strictement rien. A tel point que je ne sais pas si c'est possible de l'utiliser pour travailler au niveau des communes et pas des pays. J'ai passé en revue plusieurs des liens de la page mais je comprends toujours pas plus...

Donc voilà, si quelqu'un a un peu de temps à perdre je lui serai infiniment reconnaissant pour toute info me permettant d'approcher mon but. Rien que de me dire si cet outil peut ou non travailler au niveau des communes (via code postal ou nom, peu importe) ce serait déjà super cool.

Merci d'avance,

Je viens d'essayer de jouer un peu sur le play ground, avec le code :
function drawVisualization() {
  var data = new google.visualization.DataTable();
  data.addRows(6);
  data.addColumn('string', 'City');
  data.addColumn('number', 'Popularity');
  data.setValue(0, 0, 'Paris');
  data.setValue(0, 1, 200);
  data.setValue(1, 0, 'Bordeaux');
  data.setValue(1, 1, 300);
  data.setValue(2, 0, 'Marseille');
  data.setValue(2, 1, 400);
  data.setValue(3, 0, 'Rennes');
  data.setValue(3, 1, 500);
  data.setValue(4, 0, 'Lille');
  data.setValue(4, 1, 600);
  data.setValue(5, 0, 'Lyon');
  data.setValue(5, 1, 700);
  
  
var options = {};  
  options['region'] = 'FR';	  
  options['colors'] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors	  
  options['dataMode'] = 'markers';  
  var geomap = new google.visualization.GeoMap(
	  document.getElementById('visualization'));
  geomap.draw(data, options);
}

et j'obtiens bien des données par villes.
De ce que je comprends, la variable data te permet de déclarer les données avec en gros et de facon simplifiée deux lignes par data correspond à l'attribut et la valeur.
Ce qui est important aussi, c'est la variable option qui déclare sur quelle zone tu travaille avec les couleurs, et les type de marqueurs.

J'ai essayé pour la Belgique mais je ne connais pas le code (j'ai essayé BE bêtement mais ça n'a rien donné :S).

Donc du coup, je réponds oui c'est possible de travailler avec les villes, et je laisse plus compétent que moi pour dire comment :)

EDIT:
Je rectifie avec le code
function drawVisualization() {
  var data = new google.visualization.DataTable();
  data.addRows(3);
  data.addColumn('string', 'City');
  data.addColumn('number', 'Popularity');
  data.setValue(0, 0, 'Bruxelles');
  data.setValue(0, 1, 600);
	data.setValue(1, 0, 'Anvers');
  data.setValue(1, 1, 400);
	data.setValue(2, 0, 'Liege');
  data.setValue(2, 1,500);
  
  
  
var options = {};  
  options['region'] = 'BE';	  
  options['colors'] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors	  
  options['dataMode'] = 'markers';  
  var geomap = new google.visualization.GeoMap(
	  document.getElementById('visualization'));
  geomap.draw(data, options);
}

On a bien des données pour la Belgique.

Modifié par Micedre, 28 November 2011 - 17:00.


#3
Miaouss

Miaouss

    Yoda Geek

  • Membre
  • PipPipPipPipPipPip
  • 3031 messages

Voir le messageMicedre, le 28 November 2011 - 16:24, dit :

On a bien des données pour la Belgique.
Fantastique !!! ça me donne un bon point de départ. Merci beaucoup :drink:

Bon alors j'ai continué à creuser :
  • Il reconnait les normes Iso 3166 (BE pour Belgique) mais hélas pas Iso 3166-2 (BE-WAL pour Wallonie). Pas de bol mais pas trop grave
  • Je ne comprends pas comment je peux faire pour charger mes données à partir d'une feuille excel, google doc, txt, whatever... J'ai des stats sur 270 communes, je me vois mal rentrer les données une à une. Surtout que c'est le genre de graphique que je devrai refaire quelques fois. Ils ont l'air de dire ici que c'est possible mais de nouveau je ne comprend pas comment. EDIT : je viens de trouver une piste ici. Je vais voir si j'y comprends quelque chose :notify:
  • Je n'ai pas trouvé comment "récupérer" la carte ainsi composée. Obligé de devoir faire un printscreen ? Je pourrai m'en contenter mais ça m'embêterait qu'autre chose soit possible et que je ne le voie pas parce que je suis incompétent :P
Encore un énorme merci d'avance à n'importe qui qui lira mes messages et encore plus à ceux qui y répondent ;)

Modifié par Miaouss, 29 November 2011 - 11:38.

.... Mais en vrai vous faites quoi comme travail ?...

#4
Micedre

Micedre

    Padawan Geek

  • Membre
  • PipPip
  • 68 messages
Ah mais en fait, je viens de relire ton post initial, et tu veux juste obtenir les cartes (sous formes d'images?) à partir de tes données?
Si c'est bien ça, alors la solution Google Chart Tool n'est surement pas la plus adaptée (c'est plus fait pour afficher une carte sur un site Web).
A une époque, j'aurais fait ça avec SAS, mais R doit être capable d'en faire autant.

Une recherche google renvoie : http://tolstoy.newca...4/04/0191.html et surtout http://geodacenter.asu.edu/r-old

Surtout qu'avec R, la récupération de données est quand même tres simple (faut quand même se mettre un peu dedans au début).

#5
Miaouss

Miaouss

    Yoda Geek

  • Membre
  • PipPipPipPipPipPip
  • 3031 messages
Oui à terme ce serait bien que je me mette à R parce que j'ai déjà repéré plusieurs modules qui m'intéressent. Mais pour le moment j'essaye d'avoir un premier aperçu avec un minimum d'investissement en temps, c'est pour ça que Google Chart Tool semblait pratique. D'ailleurs j'ai continué à chercher et j'ai l'impression que l'idée ce serait de joindre ce bout de code :
function initialize() {
  // Replace the data source URL on next line with your data source URL.
  // Specify that we want to use the XmlHttpRequest object to make the query.
  var opts = {sendMethod: 'xhr'};
  var query = new google.visualization.Query('http://spreadsheets.google.com?key=123AB&...', opts);

  // Optional request to return only column C and the sum of column B, grouped by C members.
  query.setQuery('select C, sum(B) group by C');

  // Send the query with a callback function.
  query.send(handleQueryResponse);
}
Avec celui-ci + ensuite le tiens
function handleQueryResponse(response) {
  if (response.isError()) {
	alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
	return;
  }
  var data = response.getDataTable();
  var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
  chart.draw(data, {width: 400, height: 240, is3D: true});
}
Mais à nouveau, je ne sais pas encore trop comment...

Modifié par Miaouss, 29 November 2011 - 13:54.

.... Mais en vrai vous faites quoi comme travail ?...

#6
Micedre

Micedre

    Padawan Geek

  • Membre
  • PipPip
  • 68 messages
Ok, donc pour ce que tu veux faire, j'ai commencé par créer un spreadsheet google ici : https://docs.google....BUSVlDSFE#gid=0

puis avec la page html suivante j'obtiens un truc qui commence à ressembler à ce que tu veux :

<!--
You are free to copy and use this sample in accordance with the terms of the
Apache license (http://www.apache.org/licenses/LICENSE-2.0.html)
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Google Visualization API Sample</title>
  <script type="text/javascript" src="http://www.google.com/jsapi"></script>
  <script type="text/javascript">
	google.load('visualization', '1', {packages: ['geomap']});

	function drawVisualization() {

	  // Replace the data source URL on next line with your data source URL.
	  // Specify that we want to use the XmlHttpRequest object to make the query.
	  var opts = {sendMethod: 'scriptInjection'};
	  var query = new google.visualization.Query('https://docs.google.com/spreadsheet/tq?key=0An5w0U0WoiJXdG5SQUpnNEt5MGowQ0d0QVBUSVlDSFE&headers=1', opts);


	  // Send the query with a callback function.
	  query.send(function(response){
	   if (response.isError()) {
			alert('Error in query: ' + response.getMessage() + ' ' + response.getDetailedMessage());
			return;
		}
		var data = response.getDataTable();
		  //Pour voir les données de la table :
		  //var datacontainer = document.getElementById('data');
		  //datacontainer.innerText=data.toJSON();

		  var options = {};
		  options['region'] = 'BE';
		  options['colors'] = [0xFF8747, 0xFFB581, 0xc06000]; //orange colors
		  options['dataMode'] = 'markers';

		  var container = document.getElementById('visualization');
		  var geomap = new google.visualization.GeoMap(container);
		  geomap.draw(data, options);
	  });
	}


	google.setOnLoadCallback(drawVisualization);
  </script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="visualization" style="width: 800px; height: 400px;"></div>
<div id="data" ></div>
</body>
</html>



Après, il faudrait étudier en détails les options disponibles pour améliorer l'affichage...

Et bien sûr, je découvre cet outil en même temps que toi, donc à prendre avec des pincettes.

Modifié par Micedre, 29 November 2011 - 19:37.


#7
Miaouss

Miaouss

    Yoda Geek

  • Membre
  • PipPipPipPipPipPip
  • 3031 messages
Oh purée j'ai même pas vu que tu avais posté dans le sujet !!

Merci, je regarde ça de suite !!
.... Mais en vrai vous faites quoi comme travail ?...




1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)