Bienvenue sur PostGIS.fr

Bienvenue sur PostGIS.fr , le site de la communauté des utilisateurs francophones de PostGIS.

PostGIS ajoute le support d'objets géographique à la base de données PostgreSQL. En effet, PostGIS "spatialise" le serverur PostgreSQL, ce qui permet de l'utiliser comme une base de données SIG.

Maintenu à jour, en fonction de nos disponibilités et des diverses sorties des outils que nous testons, nous vous proposons l'ensemble de nos travaux publiés en langue française.

source: trunk/workshop-routing-foss4g/web/GeoExt/examples/layeropacityslider.html @ 76

Revision 76, 2.3 KB checked in by djay, 10 years ago (diff)

Ajout du répertoire web

  • Property svn:executable set to *
Line 
1<html>
2    <head>
3        <title>GeoExt LayerOpacitySlider</title>
4
5        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/adapter/ext/ext-base.js"></script>
6        <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.2.1/ext-all.js"></script>
7        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.2.1/resources/css/ext-all.css" />
8        <link rel="stylesheet" type="text/css" href="http://dev.sencha.com/deploy/dev/examples/shared/examples.css"></link>
9        <script src="http://www.openlayers.org/api/2.10/OpenLayers.js"></script>
10        <script type="text/javascript" src="../script/GeoExt.js"></script>
11        <style type="text/css">
12            .x-tree-node-leaf .gx-tree-layer-icon {
13                width: 0px;
14            }
15        </style>
16
17        <script type="text/javascript" src="layeropacityslider.js"></script>
18    </head>
19    <body>
20        <h1>GeoExt.LayerOpacitySlider</h1>
21
22        <p>The LayerOpacitySlider allows control of a layer opacity using an
23        Ext.Slider.  It is also possible to add a special tooltip plugin,
24        LayerOpacitySliderTip, which will show the opacity value while dragging
25        the slider (the content is configurable).<p>
26
27        <p>In this example, the slider in below the map is in aggressive mode: the
28        opacity is changed as soon as the slider is moved. The slider inside
29        Map 1 is not aggressive: the opacity is changed when the slider is
30        released. Also, the slider below the map is an inverse slider, which means
31        it uses transparency instead of opacity.</p>
32
33        <p>In Map 2 we have a fading effect between two layers. The slider is configured
34        with changeVisibility:true and a complementaryLayer. This avoids downloading images
35        when layer opacity is 0 or when complementaryLayer is fully covered by layer.
36        The effect on layer visibility is shown in the tree (checkboxes).</p>
37
38        <p>The js is not minified so it is readable. See <a
39        href="layeropacityslider.js">layeropacityslider.js</a>.</p>
40
41            <div id="map1-container" style="float:left"></div>
42            <div id="map2-container" style="float:right"></div>
43            <div id="tree" style="float:right"></div>
44            <div id="slider" style="clear:both"></div>
45    </body>
46</html>
Note: See TracBrowser for help on using the repository browser.