rigacci.org

User Tools

Site Tools

Trace:
tecnica:gps_cartografia_gis:openlayers_900913

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revision		Previous revision
tecnica:gps_cartografia_gis:openlayers_900913 [2010/11/05 14:21] – niccolotecnica:gps_cartografia_gis:openlayers_900913 [2010/11/05 14:47] (current) – niccolo
Line 12: Line 12:
 Vedere la FAQ a proposito di **[[http://proj.maptools.org/faq.html#sphere_as_wgs84|PROJ.4 e Virtual Earth]]**. Vedere la FAQ a proposito di **[[http://proj.maptools.org/faq.html#sphere_as_wgs84|PROJ.4 e Virtual Earth]]**.
  
-===== Mostrare un mark sulla mappa OSM =====+===== Il codice JavaScript =====
  
-Fare zoom e pan quanto basta per mettere il punto desiderato al centro della mappa, quindi cliccare su **Permalink** in basso a destra. A questo punto basta modificare l'URL, sostituendo ''lat'' e ''lon'' rispettivamente con **''mlat''** e **''mlon''**. Un esempio:+OpenLayers supporta attualmente le mappe OpenStreetMap tramite l'oggetto **''OpenLayers.Layer.OSM()''** sebbene nella documentazione ufficiale (versione 2.10) questo non sia ancora documentato.
  
-[[http://www.openstreetmap.org/?mlat=43.8200&mlon=11.13311&zoom=16&layers=0B00FTF]]+Esiste la possibilità di caricare una piccola libreria JavaScript che estende l'oggetto **''OpenLayers.Layer.OSM()''** e permette di avere le sotto-classi **''Mapnik''**, **''Osmarender''** e **''CycleMap''**.
  
-Questo trucco funziona sul sito di OpenStreetMap, purtroppo non funziona su altri simili che usano sempre OpenLayers, ad esempio http://www.informationfreeway.org/.+Il codice JavaScript è disponibile al seguente indirizzo: [[http://www.openstreetmap.org/openlayers/OpenStreetMap.js]].
  
 +Alcuni esempi basici si trovano qui: **[[http://wiki.openstreetmap.org/wiki/OpenLayers_Simple_Example|OpenLayers Simple Example]]**.
  
- +Ecco ad esempio un estratto di codice JavaScript:
-===== Dynamic layer update ===== +
- +
-We want to refresh the contents of a layer using a timer, every time we want to fetch new data from the server. +
- +
-==== OpenLayers.Layer.GeoRSS ==== +
- +
-This is an example of a **GeoRSS** layer, updated every 120 seconds. Every point is drawn with the same icon, a pop-up will appear when the icon is clicked.+
  
 <code javascript> <code javascript>
-var friends;+// Define the map object. 
 +map = new OpenLayers.Map('map', { 
 +    maxExtent: new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34, 20037508.34), 
 +    controls: [ 
 +        new OpenLayers.Control.Navigation(), 
 +        new OpenLayers.Control.PanZoomBar(), 
 +        new OpenLayers.Control.LayerSwitcher(), 
 +        new OpenLayers.Control.KeyboardDefaults(), 
 +        new OpenLayers.Control.Scale() 
 +    ], 
 +    scales: [500000, 200000, 100000, 50000, 25000, 10000, 5000], 
 +    units: 'm', 
 +    projection: new OpenLayers.Projection("EPSG:900913"), 
 +    displayProjection: new OpenLayers.Projection("EPSG:4326") 
 +});
  
-function init() { +// Add OpenStreetMap Mapnik layer. 
-    ... +var layerMapnik = new OpenLayers.Layer.OSM("OpenStreetMap"); 
-    // Add tangoGPS friends layer. +layerMapnik.transitionEffect = "resize"; 
-    friends = new OpenLayers.Layer.GeoRSS("Friends", "tangogps-friend.php", { +layerMapnik.isBaseLayer = true; 
-        projection: map.displayProjection +map.addLayer(layerMapnik);
-    }); +
-    friends.icon = new OpenLayers.Icon( +
-        "icons/tangogps-friend.png"); +
-    map.addLayer(friends); +
-    ... +
-    var tim = setInterval ("updateFriends()", 120000); +
-} +
- +
-function updateFriends() { +
-    friends.clearMarkers(); +
-    friends.clearFeatures(); +
-    friends.loaded = false; +
-    friends.loadRSS(); +
-}+
 </code> </code>
  
-The code **''tangogps-friend.php''** should return GeoRSS formatted text (like **{{.openlayers:georss.xml|this example}}**), with proper expire and no cache headers:+===== Mostrare un mark sulla mappa OSM =====
  
-<code php> +Fare zoom e pan quanto basta per mettere il punto desiderato al centro della mappa, quindi cliccare su **Permalink** in basso a destra. A questo punto basta modificare l'URL, sostituendo ''lat'' e ''lon'' rispettivamente con **''mlat''** e **''mlon''**. Un esempio:
-header("Cache-Control: no-cache, must-revalidate"); +
-header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); +
-header("Content-Type: text/xml"); +
-... +
-</code>+
  
-==== OpenLayers.Layer.GML ==== +[[http://www.openstreetmap.org/?mlat=43.8200&mlon=11.13311&zoom=16&layers=0B00FTF]]
- +
-This is a more complex example, using a **GML** layer in GML format. The GML geometry is drawn with the default style. The layer is reloaded by a timer every 120 seconds. We use a BBOX strategy, so that the layer is reloaded also when the bounding box changes. Layer is loaded via HTTP protocol. +
- +
-<code javascript> +
-var friends; +
- +
-function init() { +
-    ... +
-    // Add tangoGPS friends layer. +
-    friends = new OpenLayers.Layer.GML("GML", "friends-gml.php", { +
-        strategies: [new OpenLayers.Strategy.BBOX()], +
-        projection: map.displayProjection, +
-        protocol: new OpenLayers.Protocol.HTTP({ +
-            url: "friends-gml.php", +
-            format: new OpenLayers.Format.GML() +
-        }), +
-    }); +
-    map.addLayer(friends); +
-    ... +
-    var tim = setInterval ("updateFriends()", 120000); +
-} +
- +
-function updateFriends() { +
-    var now = new Date().valueOf(); +
-    var bbox = map.getExtent().toBBOX(); +
-    friends.setUrl("friends-gml.php?bbox=" + bbox + "&time=" + now); +
-} +
-</code> +
- +
-The **''friends-gml.php''** should return a valid GML file (like **{{.openlayers:gml.xml|this example}}**) and it should be non cacheable (using the same headers of GeoRSS layer above). The script will be called with the following arguments: +
- +
-<file> +
-friends-gml.php +
-</file> +
-The first call (without query parameters) is triggered by the second argument of the layer constructor. To optimize memory usage in the browser, the script **''friends-gml.php''** should honor the **''bbox''** request and return only the relevant features. Called without the parameter, it can return no features. +
- +
-<file> +
-friends-gml.php?bbox=-10.77,41.32,11.72,52.57 +
-</file> +
-Immediately after the layer creation, a new call is triggered by the BBOX strategy. This time the **bbox** parameter is automatically appended to the **''url''** declared with **''OpenLayers.Protocol.HTTP''**. A similar call is performed whenever a bounding box change event is detected. +
- +
-<file> +
-friends-gml.php?bbox=-15.15,44.13,16.12,49.75&time=1232668479793 +
-</file> +
-Every timer interval, the layer is refreshed. Reading new data is forced by setting a new and unique **''time''** parameter. In this case ''bbox'' is not automatically added (it was the timer which trigger the call, not the BBOX strategy), so we have to add it programmatically. +
- +
-==== OpenLayers.Layer.Text ==== +
- +
-This is a very versatile example: every point can be represented by a different icon, a pop-up appears when you click an icon. The disadvantage is that all the layer features are loaded at every timer interval, no bounding box limit is enforced. +
- +
-<code javascript> +
-var friends; +
- +
-function init() { +
-    ... +
-    // Add tangoGPS friends layer. +
-    friends = new OpenLayers.Layer.Text("Friends", { +
-        location:"friends-text.php", +
-        projection: map.displayProjection}); +
-    map.addLayer(friends); +
-    ... +
-    var tim = setInterval ("updateFriends()", 120000); +
-} +
- +
-function updateFriends() { +
-    // Remove markers and features. +
-    friends.clearMarkers(); +
-    friends.clearFeatures(); +
-    // Pretend the layers is not yet loaded. +
-    friends.loaded = false; +
-    friends.location = "friends-text.php"; +
-    friends.loadText(); +
-} +
-</code> +
- +
-The text returned by **''friends-text.php''** should be non cacheable as always and contains a tab separated text, like **{{.openlayers:layertext.txt|this example}}**. +
- +
-This recipe can be improved by adding a ''bbox'' parameter (calculated at runtime) to the location of the layer, and forcing a call to ''updateFriends()'' whenever the viewport of the map changes.+
  
 +Questo trucco funziona sul sito di OpenStreetMap, purtroppo non funziona su altri simili che usano sempre OpenLayers, ad esempio http://www.informationfreeway.org/.
tecnica/gps_cartografia_gis/openlayers_900913.1288963268.txt.gz · Last modified: by niccolo