Merge branch 'master' of github.com:openlayers/ol3 into vector

2013-01-24 22:21:25 -07:00
parent 4e3f984796 fc9bfe8460
commit a7737150fe
49 changed files with 1694 additions and 571 deletions
--- a/examples/anchored-elements.html
+++ b/examples/anchored-elements.html
@@ -80,7 +80,7 @@
        margin-left: -13px;
      }
    </style>
-    <title>Overlay example</title>
+    <title>Anchored elements example</title>
  </head>
  <body>
    <div id="map">
@@ -89,16 +89,16 @@
      <!-- Popup -->
      <div class="overlay arrow_box" id="popup"></div>
      <div id="text">
-        <h1 id="title">Overlay example</h1>
-        <div id="shortdesc">Demonstrates Overlays.</div>
+        <h1 id="title">Anchored elements example</h1>
+        <div id="shortdesc">Demonstrates anchored elements.</div>
        <div id="docs">
          <p>See the
-          <a href="overlay-and-popup.js" target="_blank">overlay-and-popup.js source</a>
+          <a href="anchored-elements.js" target="_blank">anchored-elements.js source</a>
          to see how this is done.</p>
        </div>
      </div>
    </div>
-    <div id="tags">overlay, popup, mapquest, openaerial</div>
-    <script src="loader.js?id=overlay-and-popup" type="text/javascript"></script>
+    <div id="tags">anchored elements, overlay, popup, mapquest, openaerial</div>
+    <script src="loader.js?id=anchored-elements" type="text/javascript"></script>
  </body>
 </html>
--- a/examples/anchored-elements.js
+++ b/examples/anchored-elements.js
@@ -1,12 +1,12 @@
 goog.require('goog.debug.Console');
 goog.require('goog.debug.Logger');
 goog.require('goog.debug.Logger.Level');
+goog.require('ol.AnchoredElement');
 goog.require('ol.Collection');
 goog.require('ol.Coordinate');
 goog.require('ol.Map');
 goog.require('ol.RendererHints');
 goog.require('ol.View2D');
-goog.require('ol.overlay.Overlay');
 goog.require('ol.source.MapQuestOpenAerial');


@@ -31,15 +31,15 @@ var map = new ol.Map({
 });

 // Vienna label
-var vienna = new ol.overlay.Overlay({
+var vienna = new ol.AnchoredElement({
  map: map,
-  coordinate: ol.Projection.transformWithCodes(
+  position: ol.Projection.transformWithCodes(
      new ol.Coordinate(16.3725, 48.208889), 'EPSG:4326', 'EPSG:3857'),
  element: document.getElementById('vienna')
 });

 // Popup showing the position the user clicked
-var popup = new ol.overlay.Overlay({
+var popup = new ol.AnchoredElement({
  map: map,
  element: document.getElementById('popup')
 });
@@ -49,5 +49,5 @@ map.addEventListener('click', function(evt) {
      'Welcome to ol3. The location you clicked was<br>' +
      ol.Coordinate.toStringHDMS(ol.Projection.transformWithCodes(
          coordinate, 'EPSG:3857', 'EPSG:4326'));
-  popup.setCoordinate(coordinate);
+  popup.setPosition(coordinate);
 });
--- a/examples/side-by-side.html
+++ b/examples/side-by-side.html
@@ -45,7 +45,7 @@
      </tr>
      <tr>
        <td>Rotate:</td>
-        <td><code>Alt</code>+drag, <code>r</code> to reset</td>
+        <td><code>Alt+Shift</code>+drag, <code>r</code> to reset</td>
      </tr>
      <tr>
        <td>Brightness/contrast:</td>
--- a/examples/side-by-side.js
+++ b/examples/side-by-side.js
@@ -107,25 +107,41 @@ keyboardInteraction.addCallback('H', function() {
  layer.setHue(layer.getHue() + (Math.PI / 5));
 });
 keyboardInteraction.addCallback('j', function() {
-  var bounce = ol.animation.createBounce(2 * view.getResolution());
+  var bounce = ol.animation.createBounce({
+    resolution: 2 * view.getResolution()
+  });
  domMap.addPreRenderFunction(bounce);
  webglMap.addPreRenderFunction(bounce);
  canvasMap.addPreRenderFunction(bounce);
 });
 keyboardInteraction.addCallback('l', function() {
-  var panFrom = ol.animation.createPanFrom(view.getCenter());
+  var panFrom = ol.animation.createPanFrom({
+    source: view.getCenter(),
+    easing: ol.easing.elastic
+  });
  domMap.addPreRenderFunction(panFrom);
  webglMap.addPreRenderFunction(panFrom);
  canvasMap.addPreRenderFunction(panFrom);
  view.setCenter(LONDON);
 });
 keyboardInteraction.addCallback('L', function() {
-  var start = Date.now();
+  var start = goog.now();
  var duration = 5000;
-  var bounce = ol.animation.createBounce(
-      2 * view.getResolution(), duration, start);
-  var panFrom = ol.animation.createPanFrom(view.getCenter(), duration, start);
-  var spin = ol.animation.createSpin(duration, 2, start);
+  var bounce = ol.animation.createBounce({
+    resolution: 2 * view.getResolution(),
+    start: start,
+    duration: duration
+  });
+  var panFrom = ol.animation.createPanFrom({
+    source: view.getCenter(),
+    start: start,
+    duration: duration
+  });
+  var spin = ol.animation.createSpin({
+    turns: 2,
+    start: start,
+    duration: duration
+  });
  var preRenderFunctions = [bounce, panFrom, spin];
  domMap.addPreRenderFunctions(preRenderFunctions);
  webglMap.addPreRenderFunctions(preRenderFunctions);
@@ -133,19 +149,34 @@ keyboardInteraction.addCallback('L', function() {
  view.setCenter(LONDON);
 });
 keyboardInteraction.addCallback('m', function() {
-  var panFrom = ol.animation.createPanFrom(view.getCenter(), 1000);
+  var panFrom = ol.animation.createPanFrom({
+    source: view.getCenter(),
+    duration: 1000,
+    easing: ol.easing.bounce
+  });
  domMap.addPreRenderFunction(panFrom);
  webglMap.addPreRenderFunction(panFrom);
  canvasMap.addPreRenderFunction(panFrom);
  view.setCenter(MOSCOW);
 });
 keyboardInteraction.addCallback('M', function() {
-  var start = Date.now();
+  var start = goog.now();
  var duration = 5000;
-  var bounce = ol.animation.createBounce(
-      2 * view.getResolution(), duration, start);
-  var panFrom = ol.animation.createPanFrom(view.getCenter(), duration, start);
-  var spin = ol.animation.createSpin(duration, -2, start);
+  var bounce = ol.animation.createBounce({
+    resolution: 2 * view.getResolution(),
+    start: start,
+    duration: duration
+  });
+  var panFrom = ol.animation.createPanFrom({
+    source: view.getCenter(),
+    start: start,
+    duration: duration
+  });
+  var spin = ol.animation.createSpin({
+    turns: -2,
+    start: start,
+    duration: duration
+  });
  var preRenderFunctions = [bounce, panFrom, spin];
  domMap.addPreRenderFunctions(preRenderFunctions);
  webglMap.addPreRenderFunctions(preRenderFunctions);
@@ -172,13 +203,19 @@ keyboardInteraction.addCallback('vV', function() {
  layer.setVisible(!layer.getVisible());
 });
 keyboardInteraction.addCallback('x', function() {
-  var spin = ol.animation.createSpin(2000, 2);
+  var spin = ol.animation.createSpin({
+    turns: 2,
+    duration: 2000
+  });
  domMap.addPreRenderFunction(spin);
  webglMap.addPreRenderFunction(spin);
  canvasMap.addPreRenderFunction(spin);
 });
 keyboardInteraction.addCallback('X', function() {
-  var spin = ol.animation.createSpin(2000, -2);
+  var spin = ol.animation.createSpin({
+    turns: -2,
+    duration: 2000
+  });
  domMap.addPreRenderFunction(spin);
  webglMap.addPreRenderFunction(spin);
  canvasMap.addPreRenderFunction(spin);
--- a/examples/two-layers.html
+++ b/examples/two-layers.html
@@ -21,7 +21,7 @@
      <tr>
        <th>DOM</th>
        <th>WebGL</th>
-        <th>Canvas</th>
+        <th>Canvas <a id="canvas-export" href="#" download="map.jpeg">export map as jpeg</a></th>
      </tr>
      <tr>
        <td><div id="domMap" class="map"></div></td>
--- a/examples/two-layers.js
+++ b/examples/two-layers.js
@@ -48,3 +48,7 @@ var canvasMap = new ol.Map({
 });
 canvasMap.bindTo('layers', webglMap);
 canvasMap.bindTo('view', webglMap);
+
+goog.events.listen(goog.dom.getElement('canvas-export'), 'click', function(e) {
+  e.target.href = canvasMap.getRenderer().getCanvas().toDataURL('image/jpeg');
+});
--- a/examples/wms-custom-proj.js
+++ b/examples/wms-custom-proj.js
@@ -52,9 +52,6 @@ var layers = new ol.Collection([
 ]);

 var map = new ol.Map({
-  // By setting userProjection to the same as projection, we do not need
-  // proj4js because we do not need any transforms.
-  userProjection: epsg21781,
  layers: layers,
  renderers: ol.RendererHints.createFromQueryData(),
  target: 'map',