Emplacement d'une légende

**Scarab Aware** · 11/04/2013, 13h19

Bonjour

J'ai pu trouver comment faire apparaître une légende en faisant une modification dans le Quickstart.html

J'ai cette partie là :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!DOCTYPE html>
<html>
  <head>
    <title>DECI</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico"/>
    <style type="text/css"><!--/*--><![CDATA[/*><!--*/


h1 {
        text-align:center;
        font-size:1.2em;
        font-style: italic;
        width:800px;
	color:#336699;
    }
	div#legende {
		text-align:center;
        background-color:#FFFFFF;
        border:0px solid black;
        padding:5px;
        };

et ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div id='titre' style='display:true; position:right; left:5px; top:5px'></div>
  <div id='legende' style='display:true; position:right; right:5px; top:10px'>
    <font color="#000000">DECI</font><br/><br/>
    <font color="#0DF20D">&diams; Réserve artificielle.</font><br/>
  </div>
  </body>
</html>

Toutefois celle-ci se place en dessous de la carte et j'aimerais pouvoir la placer à côté en haut à droite. Comment puis je procéder pour la placer comme je le souhaite ?

**Scarab Aware** · 15/04/2013, 11h55

Comme une image vaut mieux qu'un long discours...

Donc la légende est visible en bas de page, ce que je souhaite faire c'est pouvoir la placer à côté, comme le rectangle à fond bleu.

**Scarab Aware** · 15/04/2013, 13h42

Bon finalement j'ai réussi à trouver. Pour ceux que ça pourrait aider à l'avenir voici les morceaux à implémenter dans le javascript.html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
div#legende {
		position:absolute;
        top:100px;
        left:1050px;
        width:260px;
        };

On ne joue que sur le left

et la div

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<div id='legende' style='display:true; position:right; right:5px; top:100px'>

On joue sur top ici

Emplacement d'une légende

IGN API Géoportail

Discussions similaires

Partager

Partager