MyDistrict met à disposition des données (opendata et autre) sur des villes/quartiers en France.

MyDistrict est utilisable :

  • directement en API
  • sous forme de plugin en intégration avec un iframe sur un site web.

Utilisation en API

Pour l’utilisation en API, se reporter à la documentation de l’API Geoimmo (http://api.geoimmo.com/geoimmo-web/apidocs/resource_MyDistrictResource.html)

 

Utilisation en plugin

Principe

Le plug-in MyDistrict affiche les données MyDistrict sous deux formes :

  • Un tableau avec les données classées par thème
  • En option : Un module cartographique (points d’intérêts, itinéraires, …)

 

Exemple

http://mydistrict.immo/plugin/?latitude=43.529742&longitude=5.4474270000000615&key={your_api_key}

Le plug-in est paramétrable. Il lui faut au minimum une latitude, une longitude et une clé d’API pour déterminer quelles données afficher. Il peut également prendre en paramètre la liste des données que l’on souhaite afficher, un chemin vers un fichier css (pour la personnalisation graphique), une liste de points d’intérêts pour la carte…

 

Utilisation

Les paramètres peuvent être envoyées en GET ou en POST.

 

Exemple GET :

https://mydistrict.com/plugin?latitude=43.529742&longitude=5.447427&key={your_api_key}
&data=&css=http://www.monsiteperso/monsiteperso.css&map=bus,metro,college,ecole,lycee

Exemple POST :

URL : http://mydistrict.immo/plugin

Paramètres POST en JSON :

{
    "data": "nbhab,csp,appartement,maison",
    "key": "{your_api_key}",
    "latitude": 12.34,
    "longitude": 56.78,
    "map": "bus,metro",
    "css": "http://www.monsiteperso/monsiteperso.css"
}

Paramètres :

  • latitude / longitude : la latitude et la longitude du bien ou du quartier
  • data : les différentes données souhaitées dans le tableau (voir liste des données)
  • key : la clé d’API utilisateur du plugin MyDistrict
  • css : le path du css pour customiser la charte graphique
  • map : les différents types de points d’intérêts souhaités sur la carte (tous activés par défaut) (voir liste des types de points d’intérêts)

 

Récupération de la “height” de l’iframe :

Le plugin a une hauteur (height) qui varie lors de son utilisation et des changements d’onglets (les onglets n’ont pas tous le même nombre de lignes). Pour permettre d’adapter la taille de l’iframe dans laquelle est intégré le plugin, le plugin envoye sa hauteur lors des changements d’onglets. Cette hauteur est envoyée à l’aide d’un message JavaScript. Afin de récupérer ce message il suffit de rajouter ce script dans la page HTML qui appel l’iframe :

<script>
    document.getElementById("id_of_your_iframe").onload = function() {
        if (typeof window.addEventListener !== "undefined") {
            window.addEventListener("message", receiveMessage, false);
        } else {
            window.attachEvent("onmessage", receiveMessage);
        }
        function receiveMessage(e) {
            if (e.origin === "http://mydistrict.immo" && e.source.name === "name_of_your_iframe" && 
                e.source.frameElement.contentDocument.URL.indexOf("http://mydistrict.immo/plugin/") === 0) {
                document.getElementById("id_of_your_iframe").height = e.data; 
            } 
        }
    };
</script>

 

Personnalisation graphique :

Le css du plugin peut être adapté à la charte de votre site via un fichier .css dont l’URL est passée en paramètre.

Les couleurs des textes et des backgrounds peuvent être modifiés aisément, ainsi que la taille des textes. Voici une liste des principales classes css :

  • body : changement de la police (avec font-family).
  • .textColorTheme : changement de la couleur du texte des thèmes (avec color).
  • .backgroundColorTheme : changement de la couleur du background des thèmes (avec background-color).
  • .active : changement de la couleur du background du thème actif (avec background-color).
  • .textColorTableHead : changement de la couleur du texte des cellules références du tableau (avec color).
  • .textColorData1 : changement d’une des deux couleurs du texte des données du tableau (avec color).
  • .textColorData2 : changement d’une des deux couleurs du texte des données du tableau (avec color).
  • .backgroundColorVille : changement de la couleur du background des cellules des villes (avec background-color).
  • .backgroundColorTable : changement de la couleur du background du tableau (avec background-color).
  • h1 : changement de la taille du titre principal (avec font-size).
  • p, blockquote : changement de la taille de la description (avec font-size).
  • #villeSousTitre : changement de la taille du sous-titre (avec font-size).
  • .textSizeTable : changement de la taille du texte du tableau (avec font-size).

Il est bien sûr possible de rajouter des propriétés à ces différentes balises pour plus de personnalisation.

Données disponibles :

Thème Code Nom Type Descriptif