Merge branch '2.12'

This commit is contained in:
Frederic Junod
2012-03-27 09:31:53 +02:00
52 changed files with 188 additions and 62 deletions

View File

@@ -15,7 +15,7 @@
<body onload="init()">
<h1 id="title">All Overlays with Google and OSM</h1>
<div id="tags">
overlay, baselayer, google, osm, openstreetmap
overlay, baselayer, google, osm, openstreetmap, light
</div>
<p id="shortdesc">
Using the Google and OSM layers as overlays.

View File

@@ -61,7 +61,7 @@
<body onload="init()">
<h1 id="title">OpenLayers Overlays Only Example</h1>
<div id="tags">
overlay, baselayer
overlay, baselayer, light
</div>
<p id="shortdesc">
Demonstrates a map with overlays only.

View File

@@ -40,7 +40,7 @@
<h1 id="title">Attribution Example</h1>
<div id="tags">
copyright, watermark, logo, attribution
copyright, watermark, logo, attribution, light
</div>
<p id="shortdesc">

View File

@@ -20,7 +20,7 @@
<h1 id="title">Basic Bing Tiles Example</h1>
<div id="tags">
bing tiles
bing tiles, light
</div>
<div id="shortdesc">Use Bing with direct tile access</div>

View File

@@ -48,7 +48,7 @@
<h1 id="title">Bing Example</h1>
<div id="tags">
Bing, Microsoft, Virtual Earth
Bing, Microsoft, Virtual Earth, light
</div>
<p id="shortdesc">

View File

@@ -45,7 +45,7 @@
<h1 id="title">Boxes Example Vector</h1>
<div id="tags">
box, vector, annotation
box, vector, annotation, light
</div>
<p id="shortdesc">

View File

@@ -37,7 +37,7 @@
<h1 id="title">Buffer Example</h1>
<div id="tags">
buffer, performance, tile
buffer, performance, tile, light
</div>
<p id="shortdesc">

View File

@@ -70,7 +70,7 @@
<div id="tags">
click control, double, doubleclick, double-click, event, events,
propagation
propagation, light
</div>
<p id="shortdesc">

View File

@@ -8,7 +8,7 @@
<link rel="stylesheet" href="../theme/default/style.css" type="text/css"/>
<link rel="stylesheet" href="style.css" type="text/css">
<script src="../lib/Firebug/firebug.js"></script>
<script src="../lib/OpenLayers.js"></script>
<script src="../lib/OpenLayers.js"></script>
<script src="clientzoom.js"></script>
<style>
.olControlAttribution {

View File

@@ -50,7 +50,7 @@
<h1 id="title">Custom Control Example</h1>
<div id="tags">
control, panel, rectangle
control, panel, rectangle, light
</div>
<p id="shortdesc">

View File

@@ -10,7 +10,7 @@
</head>
<body>
<h1 id="title">OpenLayers Example</h1>
<div id="tags">simple, basic</div>
<div id="tags">simple, basic, light</div>
<p id="shortdesc">
Demonstrate a simple map with an overlay that includes layer switching controls.
</p>

View File

@@ -63,7 +63,7 @@
<h1 id="title">GeoJSON Example</h1>
<div id="tags">
JSON, GeoJSON
JSON, GeoJSON, light
</div>
<p id="shortdesc">

View File

@@ -11,7 +11,7 @@
<body>
<h1 id="title">Google (Static Maps API) Grid Layer Example</h1>
<div id="tags">
Google, grid, static, GMaps
Google, grid, static, GMaps, light
</div>
<p id="shortdesc">
Using the Google Static Maps API with a Grid Layer.

View File

@@ -15,7 +15,7 @@
<body onload="init()">
<h1 id="title">Google (v3) allOverlays Layer Example</h1>
<div id="tags">
Google, overlay
Google, overlay, light
</div>
<p id="shortdesc">
Demonstrate use the Google Maps v3 API with allOverlays set to true on the map.

View File

@@ -15,7 +15,7 @@
<body onload="init()">
<h1 id="title">Google (v3) Layer Example</h1>
<div id="tags">
Google, api key, apikey
Google, api key, apikey, light
</div>
<p id="shortdesc">
Demonstrate use the Google Maps v3 API.

View File

@@ -14,7 +14,7 @@
<body onload="init();">
<h1 id="title">Named Graphics Example</h1>
<div id="tags">
vector, named graphic, star, cross, x, square, triangle, circle, style
vector, named graphic, star, cross, x, square, triangle, circle, style, light
</div>
<p id="shortdesc">
Shows how to use well-known graphic names.

View File

@@ -18,7 +18,7 @@
<h1 id="title">Gutter Example</h1>
<div id="tags">
gutter, quality, tile
gutter, quality, tile, light
</div>
<p id="shortdesc">

View File

@@ -29,7 +29,7 @@
<h1 id="title">Late Rendering</h1>
<div id="tags">
creation, render, div
creation, render, div, light
</div>
<p id="shortdesc">

View File

@@ -70,7 +70,7 @@
<h1 id="title">Layer Opacity Example</h1>
<div id="tags">
opacity, transparent, transparency
opacity, transparent, transparency, light
</div>
<p id="shortdesc">

View File

@@ -112,7 +112,7 @@
<h1 id="title">Layer Load Monitoring Example</h1>
<div id="tags">
monitor, loading
monitor, loading, light
</div>
<p id="shortdesc">

View File

@@ -42,7 +42,7 @@
<h1 id="title">Layer Switcher Example</h1>
<div id="tags">
tree, layerswitcher, reposition
tree, layerswitcher, reposition, light
</div>
<p id="shortdesc">

35
examples/light-basic.html Normal file
View File

@@ -0,0 +1,35 @@
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<title>OpenLayers Light - Basic Popups</title>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<script src="../OpenLayers.light.debug.js"></script>
<script src="light-basic.js"></script>
</head>
<body onload="init()">
<h1 id="title">OpenLayers Light - Basic Popups</h1>
<div id="tags">
light, vector, feature, popup
</div>
<p id="shortdesc">
A basic use case example using the OpenLayers.light version of the library.<br>
Shows popup info bubble when hovering over features on the map
</p>
<div id="map" class="smallmap"></div>
<div id="docs">
<p>
This example uses OpenLayers.light.js to display features and show
popup info bubbles when the feature is hovered over.
</p>
See the <a href="light-basic.js" target="_blank">
light-basic.js source</a> to see how this is done.
</p>
</div>
</body>
</html>

66
examples/light-basic.js Normal file
View File

@@ -0,0 +1,66 @@
var map;
function init() {
map = new OpenLayers.Map("map",{projection:"EPSG:3857"});
var osm = new OpenLayers.Layer.OSM();
var toMercator = OpenLayers.Projection.transforms['EPSG:4326']['EPSG:3857'];
var center = toMercator({x:-0.05,y:51.5});
/**
* Create 5 random vector features. Your features would typically be fetched
* from the server. The features are given an attribute named "foo".
* The value of this attribute is an integer that ranges from 0 to 100.
*/
var features = [];
for(var i = 0; i < 5; i++) {
features[i] = new OpenLayers.Feature.Vector(
toMercator(new OpenLayers.Geometry.Point(
-0.040 - 0.05*Math.random(),
51.49 + 0.02*Math.random())),
{
foo : 100 * Math.random() | 0
}, {
fillColor : '#008040',
fillOpacity : 0.8,
strokeColor : "#ee9900",
strokeOpacity : 1,
strokeWidth : 1,
pointRadius : 8
});
}
// create the layer with listeners to create and destroy popups
var vector = new OpenLayers.Layer.Vector("Points",{
eventListeners:{
'featureselected':function(evt){
var feature = evt.feature;
var popup = new OpenLayers.Popup.FramedCloud("popup",
OpenLayers.LonLat.fromString(feature.geometry.toShortString()),
null,
"<div style='font-size:.8em'>Feature: " + feature.id +"<br>Foo: " + feature.attributes.foo+"</div>",
null,
true
);
feature.popup = popup;
map.addPopup(popup);
},
'featureunselected':function(evt){
var feature = evt.feature;
map.removePopup(feature.popup);
feature.popup.destroy();
feature.popup = null;
}
}
});
vector.addFeatures(features);
// create the select feature control
var selector = new OpenLayers.Control.SelectFeature(vector,{
autoActivate:true
});
map.addLayers([osm, vector]);
map.addControl(selector);
map.setCenter(new OpenLayers.LonLat(center.x,center.y), 13);
}

View File

@@ -31,7 +31,7 @@
<h1 id="title">Multiple Server URLS</h1>
<div id="tags">
performance, multiple urls, request
performance, multiple urls, request, light
</div>
<p id="shortdesc">
Load your tiles faster by pointing to the same server, but with different urls

View File

@@ -26,7 +26,7 @@
<h1 id="title">Navigation Control</h1>
<div id="tags">
drag, move, zoom, navigate
drag, move, zoom, navigate, light
</div>
<div id="shortdesc">Demonstrate Navigation Control features</div>

View File

@@ -177,7 +177,7 @@
<h1 id="title">Z-Index/Y-Order Example</h1>
<div id="tags">
stack, stacking, zindex, ordering
stack, stacking, zindex, ordering, light
</div>
<p id="shortdesc">

View File

@@ -18,7 +18,7 @@
Demonstrate use of an OSM layer and a Google layer as base layers.
</p>
<div id="tags">
openstreetmap google
openstreetmap google light
</div>
<div id="map" class="smallmap"></div>
<div id="docs">

View File

@@ -59,7 +59,7 @@
<h1 id="title">Grayscale OSM Example</h1>
<div id="tags">
openstreetmap canvas grayscale
openstreetmap canvas grayscale light
</div>
<div id="shortdesc">Show an OSM Map in grayscale</div>

View File

@@ -27,7 +27,7 @@
<h1 id="title">Basic OSM Example</h1>
<div id="tags">
openstreetmap basic
openstreetmap basic light
</div>
<div id="shortdesc">Show a Simple OSM Map</div>

View File

@@ -85,7 +85,7 @@
<body onload="init()">
<h1 id="title">Resize Features Programatically</h1>
<div id="tags">
vector, feature, resizing, resize
vector, feature, resizing, resize, light
</div>
<p id="shortdesc">
Demonstration of how to use the geometry resize methods to

View File

@@ -42,7 +42,7 @@
<body onload="init()">
<h1 id="title">OpenLayers Restricted Extent Example</h1>
<div id="tags">
map, restrict, restrictedextent, extent
map, restrict, restrictedextent, extent, light
</div>
<p id="shortdesc">
Don't let users drag outside the map extent: instead, limit dragging such

View File

@@ -99,7 +99,7 @@
<h1 id="title">Rotate vector features</h1>
<div id="tags">
vector, feature, rotating, rotation, rotate, advanced
vector, feature, rotating, rotation, rotate, advanced, light
</div>
<p id="shortdesc">
Details on how to create and rotate vector features programmatically

View File

@@ -117,7 +117,7 @@
<body onload="init()">
<h1 id="title">OpenLayers Select Feature on Multiple Layers Example</h1>
<div id="tags">
vector, feature, selecting, selection, advanced
vector, feature, selecting, selection, advanced, light
</div>
<p id="shortdesc">
Select a feature on click with the Control.SelectFeature on multiple

View File

@@ -10,7 +10,7 @@
</head>
<body>
<h1 id="title">Single Tile Example</h1>
<div id="tags">tile, ratio, singleTile, performance</div>
<div id="tags">tile, ratio, singleTile, performance, light</div>
<p id="shortdesc">
Use the singleTile option on gridded layers to request a single tile.
</p>

View File

@@ -13,7 +13,7 @@
<body onload="init()">
<h1 id="title">Rule Based Style</h1>
<div id="tags">
vector, feature, stylemap, filter, comparison
vector, feature, stylemap, filter, comparison, light
</div>
<p id="shortdesc">
Use rule based styling to use different symbolizers for different

View File

@@ -2,6 +2,9 @@ div.olControlZoom {
position: absolute;
top: 8px;
left: 8px;
background: rgba(255,255,255,0.4);
border-radius: 4px;
padding: 2px;
}
* {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
@@ -20,9 +23,9 @@ div.olControlZoom a {
width: 32px;
line-height: 28px;
text-shadow: 0 0 3px rgba(0,0,0,0.8);
background: #666666; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 0, 0, 0.3);
filter: alpha(opacity=60);
background: #130085; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 60, 136, 0.5);
filter: alpha(opacity=80);
}
a.olControlZoomIn {
border-radius: 4px 4px 0 0;
@@ -31,12 +34,18 @@ a.olControlZoomOut {
border-radius: 0 0 4px 4px;
}
div.olControlZoom a:hover {
background: #444444; /* fallback for IE */
background: rgba(0, 0, 0, 0.5);
filter: alpha(opacity=80);
background: #130085; /* fallback for IE */
background: rgba(0, 60, 136, 0.7);
filter: alpha(opacity=100);
}
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.3);
background: rgba(0, 60, 136, 0.5);
}
}
.olTileImage {
-webkit-transition: opacity 0.2s linear;
-moz-transition: opacity 0.2s linear;
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}

View File

@@ -73,7 +73,7 @@
<h1 id="title">StyleMap Example</h1>
<div id="tags">
vector, feature, stylemap
vector, feature, stylemap, light
</div>
<p id="shortdesc">

View File

@@ -92,7 +92,7 @@
<h1 id="title">Feature Styles Example</h1>
<div id="tags">
vector, feature, stylemap
vector, feature, stylemap, light
</div>
<p id="shortdesc">

View File

@@ -76,7 +76,7 @@
<body onload="init()">
<h1 id="title">Rotation Style Example</h1>
<div id="tags">
vector, feature, stylemap, rotation, cleanup
vector, feature, stylemap, rotation, cleanup, light
</div>
<p id="shortdesc">
Use the rotation property of a point symbolizer to rotate

View File

@@ -94,7 +94,7 @@
<h1 id="title">Unique Value Styles Example</h1>
<div id="tags">
vector, feature, stylemap, uniquevalue, cleanup
vector, feature, stylemap, uniquevalue, cleanup, light
</div>
<p id="shortdesc">

View File

@@ -126,7 +126,7 @@
<body onload="init()">
<h1 id="title">OpenLayers Example</h1>
<div id="tags">
vector, feature, symbolizer, filter, comparison, labeling
vector, feature, symbolizer, filter, comparison, labeling, light
</div>
<p id="shortdesc">
Demonstrate fill, stroke, and graphic property of symbolizers.

View File

@@ -11,7 +11,7 @@
<body>
<h1 id="title">Tile Origin</h1>
<div id="tags">
grid, tileOrigin
grid, tileOrigin, light
</div>
<p id="shortdesc">
Demonstrates the use of the tileExtent property to differentiate

View File

@@ -46,7 +46,7 @@
<body onload="init()">
<h1 id="title">Transition Example</h1>
<div id="tags">
transition, resize, tile, singletile
transition, resize, tile, singletile, light
</div>
<p id="shortdesc">
Demonstrates the use of transition effects in tiled and untiled layers.

View File

@@ -125,7 +125,7 @@
<body onload="init()">
<h1 id="title">OpenLayers Labeled features example</h1>
<div id="tags">
vector, feature, labeling, symbolizer
vector, feature, labeling, symbolizer, light
</div>
<p id="shortdesc">
Label vector features with a text symbolizer.

View File

@@ -123,7 +123,7 @@
<h1 id="title">Drawing Simple Vector Features Example</h1>
<div id="tags">
vector, feature
vector, feature, light
</div>
<p id="shortdesc">
Shows the use of the shows drawing simple vector features, in different styles.

View File

@@ -32,7 +32,7 @@
<h1 id="title"> WMS Untiled Example</h1>
<div id="tags">
singletile, tile
singletile, tile, light
</div>
<p id="shortdesc">
Shows an example of an "untiled" WMS layer, which requests a single

View File

@@ -40,7 +40,7 @@
<h1 id="title"> WMS version 1.3 (axis order) Example</h1>
<div id="tags">
axis order, wms 1.3
axis order, wms 1.3, light
</div>
<p id="shortdesc">
Shows an example of the influence of axis order on WMS 1.3 GetMap requests.

View File

@@ -41,7 +41,7 @@
</head>
<body>
<h1 id="title">Zoom Control Example</h1>
<div id="tags">zoom control</div>
<div id="tags">zoom control light</div>
<div id="shortdesc">Shows how to use a simple zoom control.</div>

View File

@@ -414,4 +414,4 @@
/**
* Constant: VERSION_NUMBER
*/
OpenLayers.VERSION_NUMBER="$Revision$";
OpenLayers.VERSION_NUMBER="Release 2.12-rc1";

View File

@@ -184,6 +184,20 @@ OpenLayers.Control.PinchZoom = OpenLayers.Class(OpenLayers.Control, {
location.lon += resolution * ((size.w / 2) - zoomPixel.x);
location.lat -= resolution * ((size.h / 2) - zoomPixel.y);
// Force a reflow before calling setCenter. This is to work
// around an issue occuring in iOS.
//
// See https://github.com/openlayers/openlayers/pull/351.
//
// Without a reflow setting the layer container div's top left
// style properties to "0px" - as done in Map.moveTo when zoom
// is changed - won't actually correctly reposition the layer
// container div.
//
// Also, we need to use a statement that the Google Closure
// compiler won't optimize away.
this.map.div.clientWidth = this.map.div.clientWidth;
this.map.setCenter(location, zoom);
}
},

View File

@@ -7,7 +7,7 @@ var OpenLayers = {
/**
* Constant: VERSION_NUMBER
*/
VERSION_NUMBER: "$Revision$",
VERSION_NUMBER: "Release 2.12-rc1",
/**
* Constant: singleFile

View File

@@ -433,6 +433,9 @@ div.olControlZoom {
position: absolute;
top: 8px;
left: 8px;
background: rgba(255,255,255,0.4);
border-radius: 4px;
padding: 2px;
}
div.olControlZoom a {
display: block;
@@ -447,19 +450,18 @@ div.olControlZoom a {
height: 22px;
width:22px;
line-height: 19px;
text-shadow: 0 0 3px rgba(0,0,0,0.8);
background: #666666; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 0, 0, 0.3);
filter: alpha(opacity=60);
background: #130085; /* fallback for IE - IE6 requires background shorthand*/
background: rgba(0, 60, 136, 0.5);
filter: alpha(opacity=80);
}
div.olControlZoom a:hover {
background: #444444; /* fallback for IE */
background: rgba(0, 0, 0, 0.5);
filter: alpha(opacity=80);
background: #130085; /* fallback for IE */
background: rgba(0, 60, 136, 0.7);
filter: alpha(opacity=100);
}
@media only screen and (max-width: 600px) {
div.olControlZoom a:hover {
background: rgba(0, 0, 0, 0.3);
background: rgba(0, 60, 136, 0.5);
}
}
a.olControlZoomIn {