Annonce
Pages: 1
- Sujet précédent - Ajouter des bouton de controles sous forme de texte dans Openlayers - Sujet suivant
#1 Wed 30 June 2010 10:16
- seb.49
- Participant occasionnel
- Date d'inscription: 5 Jun 2009
- Messages: 19
Ajouter des bouton de controles sous forme de texte dans Openlayers
Bonjour,
Je suis en train de refaire une appli utilisant GMap pour qu'elle utilise OpenLayers et je dois dire que si les débuts on été un peu rude, au bout de 3 jours, je suis maintenant à l'aise avec OpenLayers et je trouve ce produit vraiment top.
Pour l'instant j'ai réussi à faire tout ce que je veux sauf une chose et je n'ai rien trouvé sur le net.
OpenLayers permet d'afficher des boutons de controle sous forme d'image, je souhaiterais pour ma part avoir des bouton contenant du texte ou bien de simple texte cliquable comme ce que j'ai actuellement sur l'image jointe
Je n'ai rien trouvé pour faire ca, j'ai bien essayer en ajoutant dans le DOM des div cliquable mais le résultat ne me convient guère je préférait une solution full Openlayers.
Merci d'avance pour votre aide
Hors ligne
#2 Mon 05 July 2010 11:58
- seb.49
- Participant occasionnel
- Date d'inscription: 5 Jun 2009
- Messages: 19
Re: Ajouter des bouton de controles sous forme de texte dans Openlayers
Je me répond à moi même et j'en profite pour partager. Pas trouver de moyen 100% OL donc voici le code JS
Code:
//Méthode par ajout de controle en javascript
var ClearPolygonDiv = document.createElement('div');
ClearPolygonDiv.setAttribute('id', 'newSpan');
ClearPolygonDiv.appendChild(document.createTextNode('Nouvelle zone'));
ClearPolygonDiv.onclick = function() { clearPolygon('test'); };
document.getElementById('map').appendChild(ClearPolygonDiv);
//function SetButtonStyle(button) {
$("#" + ClearPolygonDiv.id).css('textDecoration', 'underline');
$("#" + ClearPolygonDiv.id).css('color', '#0000cc');
$("#" + ClearPolygonDiv.id).css('backgroundColor', 'white');
$("#" + ClearPolygonDiv.id).css('font', 'small Arial');
$("#" + ClearPolygonDiv.id).css('border', '1px solid black');
$("#" + ClearPolygonDiv.id).css('padding', '2px');
$("#" + ClearPolygonDiv.id).css('marginBottom', '3px');
$("#" + ClearPolygonDiv.id).css('textAlign', 'center');
$("#" + ClearPolygonDiv.id).css('width', '12em');
$("#" + ClearPolygonDiv.id).css('cursor', 'pointer');
$("#" + ClearPolygonDiv.id).css('position', 'relative');
$("#" + ClearPolygonDiv.id).css('z-index', '1003');
$("#" + ClearPolygonDiv.id).css('left', '220px');
$("#" + ClearPolygonDiv.id).css('top', '-390px');
//}Attention quand meme car un clic sur cette zone se propage sur la carte. J'ai donc ajouté à mon code un flag qui me permet de savoir si j'ai cliquer sur la zone et donc ne pas exécuter le code correspondant à un clic sur la carte
Hors ligne
Pages: 1
- Sujet précédent - Ajouter des bouton de controles sous forme de texte dans Openlayers - Sujet suivant
