Merge pull request #632 from twpayne/mobile-full-screen-example
Mobile full screen example
This commit is contained in:
@@ -0,0 +1,27 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||||
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
|
||||||
|
<title>Mobile full screen example</title>
|
||||||
|
<style type="text/css">
|
||||||
|
html, body, .map {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="map" class="map"></div>
|
||||||
|
<script src="loader.js?id=mobile-full-screen" type="text/javascript"></script>
|
||||||
|
|
||||||
|
<div style="display: none;">
|
||||||
|
<div id="title">Mobile full screen example</div>
|
||||||
|
<div id="shortdesc">Example of a full screen map.</div>
|
||||||
|
<div id="tags">fullscreen, bing, geolocation, mobile</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,35 @@
|
|||||||
|
goog.require('ol.Geolocation');
|
||||||
|
goog.require('ol.Map');
|
||||||
|
goog.require('ol.RendererHints');
|
||||||
|
goog.require('ol.View2D');
|
||||||
|
goog.require('ol.layer.TileLayer');
|
||||||
|
goog.require('ol.source.BingMaps');
|
||||||
|
|
||||||
|
|
||||||
|
var view = new ol.View2D({
|
||||||
|
center: [0, 0],
|
||||||
|
zoom: 2
|
||||||
|
});
|
||||||
|
|
||||||
|
var map = new ol.Map({
|
||||||
|
layers: [
|
||||||
|
new ol.layer.TileLayer({
|
||||||
|
source: new ol.source.BingMaps({
|
||||||
|
key: 'AlQLZ0-5yk301_ESrmNLma3LYxEKNSg7w-e_knuRfyYFtld-UFvXVs38NOulku3Q',
|
||||||
|
style: 'Road'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
],
|
||||||
|
renderers: ol.RendererHints.createFromQueryData(),
|
||||||
|
target: 'map',
|
||||||
|
view: view
|
||||||
|
});
|
||||||
|
|
||||||
|
var geolocation = new ol.Geolocation({
|
||||||
|
tracking: true
|
||||||
|
});
|
||||||
|
geolocation.bindTo('projection', view);
|
||||||
|
geolocation.on('position_changed', function() {
|
||||||
|
view.setCenter(geolocation.getPosition());
|
||||||
|
view.setResolution(2.388657133911758);
|
||||||
|
});
|
||||||
@@ -1,3 +1,10 @@
|
|||||||
|
/**
|
||||||
|
* @typedef {Object} ol.GeolocationOptions
|
||||||
|
* @property {boolean|undefined} tracking Tracking.
|
||||||
|
* @property {GeolocationPositionOptions|undefined} trackingOptions Tracking options.
|
||||||
|
* @property {ol.ProjectionLike} projection Projection.
|
||||||
|
*/
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Object literal with config options for the map.
|
* Object literal with config options for the map.
|
||||||
* @typedef {Object} ol.MapOptions
|
* @typedef {Object} ol.MapOptions
|
||||||
|
|||||||
+15
-3
@@ -33,11 +33,14 @@ ol.GeolocationProperty = {
|
|||||||
/**
|
/**
|
||||||
* @constructor
|
* @constructor
|
||||||
* @extends {ol.Object}
|
* @extends {ol.Object}
|
||||||
|
* @param {ol.GeolocationOptions=} opt_options Options.
|
||||||
*/
|
*/
|
||||||
ol.Geolocation = function() {
|
ol.Geolocation = function(opt_options) {
|
||||||
|
|
||||||
goog.base(this);
|
goog.base(this);
|
||||||
|
|
||||||
|
var options = goog.isDef(opt_options) ? opt_options : {};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The unprojected (EPSG:4326) device position.
|
* The unprojected (EPSG:4326) device position.
|
||||||
* @private
|
* @private
|
||||||
@@ -51,14 +54,23 @@ ol.Geolocation = function() {
|
|||||||
*/
|
*/
|
||||||
this.watchId_ = undefined;
|
this.watchId_ = undefined;
|
||||||
|
|
||||||
this.setTracking(false);
|
|
||||||
|
|
||||||
goog.events.listen(
|
goog.events.listen(
|
||||||
this, ol.Object.getChangedEventType(ol.GeolocationProperty.PROJECTION),
|
this, ol.Object.getChangedEventType(ol.GeolocationProperty.PROJECTION),
|
||||||
this.handleProjectionChanged_, false, this);
|
this.handleProjectionChanged_, false, this);
|
||||||
goog.events.listen(
|
goog.events.listen(
|
||||||
this, ol.Object.getChangedEventType(ol.GeolocationProperty.TRACKING),
|
this, ol.Object.getChangedEventType(ol.GeolocationProperty.TRACKING),
|
||||||
this.handleTrackingChanged_, false, this);
|
this.handleTrackingChanged_, false, this);
|
||||||
|
|
||||||
|
if (goog.isDef(options.projection)) {
|
||||||
|
this.setProjection(ol.projection.get(options.projection));
|
||||||
|
}
|
||||||
|
if (goog.isDef(options.trackingOptions)) {
|
||||||
|
this.setTrackingOptions(options.trackingOptions);
|
||||||
|
}
|
||||||
|
if (goog.isDef(options.tracking)) {
|
||||||
|
this.setTracking(options.tracking);
|
||||||
|
}
|
||||||
|
|
||||||
};
|
};
|
||||||
goog.inherits(ol.Geolocation, ol.Object);
|
goog.inherits(ol.Geolocation, ol.Object);
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user