Discussion :

[jduflost]

Bonjour,
Je suis développeur web avec un intérêt prononcé pour les applications de cartographie web. Etant familiarisé avec l'api de Google Map, j'ai voulu tester d'autres alternatives et c'est ainsi que j'ai découvert le géoportail. J'ai lu la documentation et testé quelques fonctionnalités. D'un point de vue technique, tout a très bien fonctionné jusqu'à ce que j'ai souhaité personnaliser un peu la carte comme par exemple changer la couleur de fond du titre du contrôle des couches ou la position du contrôle des outils. Donc grosso modo la personalisation des styles css ne m'est pas apparu simple d'accès. Pourriez-vous me dire s'il existe une documentation relative à cet aspect? Une autre difficulté semble être le calcul d'itinéraire, une fonctionnalité très prisée avec ce genre d'outil. Il semble qu'il y ait une possibilité avec CloudMade. Pouvez-vous me confirmer que cette fonctionnalité n'est pas prévue par votre api? Existe-t-il d'autres alternatives à CloudMade? CloudMade utilise malheureusement des données dont la qualité est variable.
Merci.

[cmail]

Bienvenue au club

Pourriez-vous me dire s'il existe une documentation relative à cet aspect?

Pour débuter dans la modif de l'aspect de l'API, il faut surtout étudier les deux exemples officiels suivants:
Le plus ancien et le tout dernier exemple

Après tu utilises les fonctions spécifiques de firebug pour repérer les div et tu te lances dans la modif en direct des css...

Pour le second point, je ne suis pas assez compétent pour te répondre.

Bon travail...

[jduflost]

Un grand merci pour ta réponse.
J'avais en effet déjà parcouru les exemples et essayé de modifier les styles css avec un outil tel que firebug mais ça me semblait un peu ardu comme façon de faire (par tatônements). Mais finalement pourquoi pas. Les deux exemples que tu m'as donné sont très intéressants. Sais-tu s'il y a d'autres themes en plus de celui par défaut, geoportal et black? De plus la fonction Geoportal.Util.loadCSS ne semble pas documentée.

De plus certains styles peuvent être directement modifiés via l'api comme dans cet exemple :
// hide navigation control (pan and zoom box) :
c= viewer.getMap().getControlsByClass('Geoportal.Control.NavToolbar');
if (c.length>0) {
c= c[0];
c.div.style.display= 'none';
}

Il est difficile de savoir d'emblée les styles qui doivent être modifiés directement dans la feuille de style ou via l'api.

[cmail]

Sais-tu s'il y a d'autres themes en plus de celui par défaut, geoportal et black?

Pas vraiment, en tant que tel dans les exemples IGN. Mais au gré des réalisations personnelles qui ne sont pas nombreuses.

De plus certains styles peuvent être directement modifiés via l'api

En effet. Je dirais même plus : "tous les styles"

Il est difficile de savoir d'emblée les styles qui doivent être modifiés directement dans la feuille de style ou via l'api.

Je dirai que les styles statiques qui ne changeront pas au gré des situations sont à introduire par css, les autres dynamiques au gré des circonstances le seront par programmation js.
Cela dit sous le controle de dgrichard...

[dgrichard]

cmail a dégrossi correctement le sujet


Les styles de l'API (comme ceux d'OpenLayers) peuvent être classés en deux catégories :

* le thème de la page web;
* le style d'un élément (widget) de la page web.

Thème:
c'est en fait un répertoire qui contient des fichiers css et des images (cf. sources de l'API). Il permet de mettre en place globalement une thèmatique. L'API propose un thème geoportal par défaut, un thème black et un thème covisu (fait pour cette page, mais pas appliqué au final, il pourrait donc disparaître). La page référencée par cmail montre comment utiliser un thème;

Style d'un élément:
chaque widget (Geoportal|Openlayers).Control a des styles pré-définis dans les thèmes (qui peuvent être vide). Ces classes CSS peuvent être surchargées. De nouveau, la page référencée par cmail montre comment surcharger des éléments. Les règles de base pour un composant sont :
* OpenLayers.Control.XX => olControlXX (classe CSS)
* Geoportal.Control.XX => gpControlXX (classe CSS)


Il n'y a pas plus de documentation que ces deux exemples vus le nombre de composant OpenLayers et Geoportal.

Le meilleur outil reste Firebug sous FF pour découvrir les styles (ou équivalent dans Chrome/Safari/Opera, sous IE, c'est prise de tête, mais possible).

[jduflost]

Merci pour ces précisions.