Use identical code in compiled and standalone examples

This commit is contained in:
Tom Payne
2012-10-15 19:12:55 +02:00
parent f9302ab030
commit f7adc1ae75
3 changed files with 3 additions and 135 deletions

View File

@@ -18,18 +18,6 @@
</head>
<body>
<div id="map"></div>
<script type="text/javascript">
var layer = new ol.layer.TileLayer({
source: new ol.source.MapQuestOpenAerial()
});
var map = new ol.Map({
center: new ol.Coordinate(0, 0),
layers: new ol.Collection([layer]),
target: 'map',
zoom: 2
});
</script>
<script src="../full-screen.js" type="text/javascript"></script>
</body>
</html>

View File

@@ -77,40 +77,6 @@
<!-- Popup -->
<div class="overlay arrow_box" id="popup"></div>
</div>
<script type="text/javascript">
var layer = new ol.layer.TileLayer({
source: new ol.source.MapQuestOpenAerial()
});
var map = new ol.Map({
center: new ol.Coordinate(0, 0),
layers: new ol.Collection([layer]),
target: 'map',
zoom: 2
});
// Vienna label
var vienna = new ol.overlay.Overlay({
map: map,
coordinate: 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({
element: document.getElementById('popup')
});
map.addEventListener('click', function(evt) {
var coordinate = evt.getCoordinate();
popup.getElement().innerHTML =
'Welcome to ol3. The location you clicked was<br>' +
ol.CoordinateFormat.hdms(ol.Projection.transformWithCodes(
coordinate, 'EPSG:3857', 'EPSG:4326'));
popup.setMap(evt.map);
popup.setCoordinate(evt.getCoordinate());
});
</script>
<script src="../overlay-and-popup.js" type="text/javascript"></script>
</body>
</html>

View File

@@ -66,92 +66,6 @@
</tr>
</table>
<p><b>Notes:</b> The two maps share the same center, resolution, rotation and layers.</p>
<script type="text/javascript">
var layer = new ol.layer.TileLayer({
source: new ol.source.MapQuestOpenAerial()
});
var domMap = new ol.Map({
center: new ol.Coordinate(0, 0),
layers: new ol.Collection([layer]),
renderer: ol.RendererHint.DOM,
target: 'domMap',
zoom: 1
});
domMap.getControls().push(new ol.control.MousePosition({
coordinateFormat: ol.CoordinateFormat.hdms,
projection: ol.Projection.getFromCode('EPSG:4326'),
target: document.getElementById('domMousePosition'),
undefinedHtml: '&nbsp;'
}));
var webglMap = new ol.Map({
renderer: ol.RendererHint.WEBGL,
target: 'webglMap'
});
if (webglMap) {
webglMap.bindTo('center', domMap);
webglMap.bindTo('layers', domMap);
webglMap.bindTo('resolution', domMap);
webglMap.bindTo('rotation', domMap);
}
webglMap.getControls().push(new ol.control.MousePosition({
coordinateFormat: ol.CoordinateFormat.hdms,
projection: ol.Projection.getFromCode('EPSG:4326'),
target: document.getElementById('webglMousePosition'),
undefinedHtml: '&nbsp;'
}));
var keyboardInteraction = new ol.interaction.Keyboard();
keyboardInteraction.addCallback('0', function() {
layer.setBrightness(0);
layer.setContrast(0);
layer.setHue(0);
layer.setSaturation(0);
layer.setOpacity(1);
layer.setVisible(true);
});
keyboardInteraction.addCallback('b', function() {
layer.setBrightness(layer.getBrightness() - 0.1);
});
keyboardInteraction.addCallback('B', function() {
layer.setBrightness(layer.getBrightness() + 0.1);
});
keyboardInteraction.addCallback('c', function() {
layer.setContrast(layer.getContrast() - 0.1);
});
keyboardInteraction.addCallback('C', function() {
layer.setContrast(layer.getContrast() + 0.1);
});
keyboardInteraction.addCallback('h', function() {
layer.setHue(layer.getHue() - 0.1);
});
keyboardInteraction.addCallback('H', function() {
layer.setHue(layer.getHue() + 0.1);
});
keyboardInteraction.addCallback('o', function() {
layer.setOpacity(layer.getOpacity() - 0.1);
});
keyboardInteraction.addCallback('O', function() {
layer.setOpacity(layer.getOpacity() + 0.1);
});
keyboardInteraction.addCallback('r', function() {
webglMap.setRotation(0);
});
keyboardInteraction.addCallback('s', function() {
layer.setSaturation(layer.getSaturation() - 0.1);
});
keyboardInteraction.addCallback('S', function() {
layer.setSaturation(layer.getSaturation() + 0.1);
});
keyboardInteraction.addCallback('vV', function() {
layer.setVisible(!layer.getVisible());
});
domMap.getInteractions().push(keyboardInteraction);
</script>
<script src="../side-by-side.js" type="text/javascript"></script>
</body>
</html>