Merge pull request #1486 from bartvde/mapquest-hybrid

add hybrid layer to ol.source.MapQuest (r=@twpayne)
This commit is contained in:
Bart van den Eijnden
2014-01-08 05:15:05 -08:00
20 changed files with 120 additions and 81 deletions
+2 -2
View File
@@ -3,7 +3,7 @@ goog.require('ol.Map');
goog.require('ol.RendererHint'); goog.require('ol.RendererHint');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
function setResetBrightnessButtonHTML() { function setResetBrightnessButtonHTML() {
@@ -23,7 +23,7 @@ if (!ol.BrowserFeature.HAS_WEBGL) {
info.style.display = ''; info.style.display = '';
} else { } else {
var layer = new ol.layer.Tile({ var layer = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var map = new ol.Map({ var map = new ol.Map({
+2 -2
View File
@@ -4,7 +4,7 @@ goog.require('ol.View2D');
goog.require('ol.interaction'); goog.require('ol.interaction');
goog.require('ol.interaction.DragRotateAndZoom'); goog.require('ol.interaction.DragRotateAndZoom');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
var map = new ol.Map({ var map = new ol.Map({
@@ -13,7 +13,7 @@ var map = new ol.Map({
]), ]),
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}) })
], ],
renderers: ol.RendererHints.createFromQueryData(), renderers: ol.RendererHints.createFromQueryData(),
+2 -2
View File
@@ -5,7 +5,7 @@ goog.require('ol.interaction');
goog.require('ol.interaction.Draw'); goog.require('ol.interaction.Draw');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
goog.require('ol.style.Fill'); goog.require('ol.style.Fill');
goog.require('ol.style.Rule'); goog.require('ol.style.Rule');
@@ -14,7 +14,7 @@ goog.require('ol.style.Stroke');
goog.require('ol.style.Style'); goog.require('ol.style.Style');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var vector = new ol.layer.Vector({ var vector = new ol.layer.Vector({
+2 -2
View File
@@ -4,14 +4,14 @@ goog.require('ol.View2D');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.parser.ogc.GML_v3'); goog.require('ol.parser.ogc.GML_v3');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
goog.require('ol.style.Fill'); goog.require('ol.style.Fill');
goog.require('ol.style.Stroke'); goog.require('ol.style.Stroke');
goog.require('ol.style.Style'); goog.require('ol.style.Style');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var vector = new ol.layer.Vector({ var vector = new ol.layer.Vector({
+2 -2
View File
@@ -5,13 +5,13 @@ goog.require('ol.dom.Input');
goog.require('ol.layer.Group'); goog.require('ol.layer.Group');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.proj'); goog.require('ol.proj');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.TileJSON'); goog.require('ol.source.TileJSON');
var map = new ol.Map({ var map = new ol.Map({
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}), new ol.layer.Group({ }), new ol.layer.Group({
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
+6
View File
@@ -25,6 +25,11 @@
<div class="row-fluid"> <div class="row-fluid">
<div class="span12"> <div class="span12">
<div id="map" class="map"></div> <div id="map" class="map"></div>
<select id="layer-select">
<option value="Aerial">Aerial</option>
<option value="AerialWithLabels">Aerial with labels</option>
<option value="Road" selected>Road</option>
</select>
</div> </div>
</div> </div>
@@ -43,6 +48,7 @@
</div> </div>
<script src="jquery.min.js" type="text/javascript"></script>
<script src="loader.js?id=mapquest" type="text/javascript"></script> <script src="loader.js?id=mapquest" type="text/javascript"></script>
<script src="../resources/example-behaviour.js" type="text/javascript"></script> <script src="../resources/example-behaviour.js" type="text/javascript"></script>
+37 -7
View File
@@ -1,22 +1,52 @@
goog.require('ol.Map'); goog.require('ol.Map');
goog.require('ol.RendererHints'); goog.require('ol.RendererHints');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.layer.Group');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.proj'); goog.require('ol.proj');
goog.require('ol.source.MapQuestOSM'); goog.require('ol.source.MapQuest');
var layers = [
new ol.layer.Tile({
style: 'Road',
source: new ol.source.MapQuest({layer: 'osm'})
}),
new ol.layer.Tile({
style: 'Aerial',
visible: false,
source: new ol.source.MapQuest({layer: 'sat'})
}),
new ol.layer.Group({
style: 'AerialWithLabels',
visible: false,
layers: [
new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'sat'})
}),
new ol.layer.Tile({
source: new ol.source.MapQuest({layer: 'hyb'})
})
]
})
];
var map = new ol.Map({ var map = new ol.Map({
layers: [ layers: layers,
new ol.layer.Tile({
source: new ol.source.MapQuestOSM()
})
],
renderers: ol.RendererHints.createFromQueryData(), renderers: ol.RendererHints.createFromQueryData(),
target: 'map', target: 'map',
view: new ol.View2D({ view: new ol.View2D({
center: ol.proj.transform( center: ol.proj.transform(
[139.6917, 35.689506], 'EPSG:4326', 'EPSG:3857'), [-73.979378, 40.702222], 'EPSG:4326', 'EPSG:3857'),
zoom: 9 zoom: 9
}) })
}); });
$('#layer-select').change(function() {
var style = $(this).find(':selected').val();
var i, ii;
for (i = 0, ii = layers.length; i < ii; ++i) {
layers[i].set('visible', (layers[i].get('style') == style));
}
});
$('#layer-select').trigger('change');
+2 -2
View File
@@ -7,7 +7,7 @@ goog.require('ol.interaction.Select');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.parser.ogc.GML_v3'); goog.require('ol.parser.ogc.GML_v3');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
goog.require('ol.style.Fill'); goog.require('ol.style.Fill');
goog.require('ol.style.Rule'); goog.require('ol.style.Rule');
@@ -16,7 +16,7 @@ goog.require('ol.style.Stroke');
goog.require('ol.style.Style'); goog.require('ol.style.Style');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var vector = new ol.layer.Vector({ var vector = new ol.layer.Vector({
+2 -2
View File
@@ -6,11 +6,11 @@ goog.require('ol.View2D');
goog.require('ol.coordinate'); goog.require('ol.coordinate');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.proj'); goog.require('ol.proj');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
var layer = new ol.layer.Tile({ var layer = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var map = new ol.Map({ var map = new ol.Map({
+2 -2
View File
@@ -6,7 +6,7 @@ goog.require('ol.interaction.Select');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.parser.ogc.GML_v3'); goog.require('ol.parser.ogc.GML_v3');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
goog.require('ol.style.Fill'); goog.require('ol.style.Fill');
goog.require('ol.style.Rule'); goog.require('ol.style.Rule');
@@ -14,7 +14,7 @@ goog.require('ol.style.Stroke');
goog.require('ol.style.Style'); goog.require('ol.style.Style');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var vector = new ol.layer.Vector({ var vector = new ol.layer.Vector({
+2 -2
View File
@@ -3,14 +3,14 @@ goog.require('ol.RendererHints');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.proj'); goog.require('ol.proj');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.TileJSON'); goog.require('ol.source.TileJSON');
var map = new ol.Map({ var map = new ol.Map({
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}), }),
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.TileJSON({ source: new ol.source.TileJSON({
+2 -2
View File
@@ -3,13 +3,13 @@ goog.require('ol.Map');
goog.require('ol.RendererHint'); goog.require('ol.RendererHint');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
var domMap = new ol.Map({ var domMap = new ol.Map({
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}) })
], ],
renderer: ol.RendererHint.DOM, renderer: ol.RendererHint.DOM,
+2 -2
View File
@@ -7,12 +7,12 @@ goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.parser.GeoJSON'); goog.require('ol.parser.GeoJSON');
goog.require('ol.parser.ogc.SLD'); goog.require('ol.parser.ogc.SLD');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
+2 -2
View File
@@ -5,7 +5,7 @@ goog.require('ol.expr');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.layer.Vector'); goog.require('ol.layer.Vector');
goog.require('ol.parser.GeoJSON'); goog.require('ol.parser.GeoJSON');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.Vector'); goog.require('ol.source.Vector');
goog.require('ol.style.Fill'); goog.require('ol.style.Fill');
goog.require('ol.style.Rule'); goog.require('ol.style.Rule');
@@ -15,7 +15,7 @@ goog.require('ol.style.Text');
var raster = new ol.layer.Tile({ var raster = new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}); });
var vector = new ol.layer.Vector({ var vector = new ol.layer.Vector({
+2 -2
View File
@@ -4,12 +4,12 @@ goog.require('ol.View2D');
goog.require('ol.layer.Image'); goog.require('ol.layer.Image');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.ImageWMS'); goog.require('ol.source.ImageWMS');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
var layers = [ var layers = [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}), }),
new ol.layer.Image({ new ol.layer.Image({
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
+2 -2
View File
@@ -2,13 +2,13 @@ goog.require('ol.Map');
goog.require('ol.RendererHint'); goog.require('ol.RendererHint');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
goog.require('ol.source.TileWMS'); goog.require('ol.source.TileWMS');
var layers = [ var layers = [
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.MapQuestOpenAerial() source: new ol.source.MapQuest({layer: 'sat'})
}), }),
new ol.layer.Tile({ new ol.layer.Tile({
source: new ol.source.TileWMS({ source: new ol.source.TileWMS({
+2 -2
View File
@@ -2,7 +2,7 @@ goog.require('ol.Map');
goog.require('ol.View2D'); goog.require('ol.View2D');
goog.require('ol.control.ZoomSlider'); goog.require('ol.control.ZoomSlider');
goog.require('ol.layer.Tile'); goog.require('ol.layer.Tile');
goog.require('ol.source.MapQuestOpenAerial'); goog.require('ol.source.MapQuest');
/** /**
@@ -14,7 +14,7 @@ goog.require('ol.source.MapQuestOpenAerial');
var createMap = function(divId) { var createMap = function(divId) {
var source, layer, map, zoomslider, resolutions; var source, layer, map, zoomslider, resolutions;
source = new ol.source.MapQuestOpenAerial(); source = new ol.source.MapQuest({layer: 'sat'});
layer = new ol.layer.Tile({ layer = new ol.layer.Tile({
source: source source: source
}); });
+1
View File
@@ -651,6 +651,7 @@
/** /**
* @typedef {Object} olx.source.MapQuestOptions * @typedef {Object} olx.source.MapQuestOptions
* @property {string} layer Layer.
* @property {ol.TileLoadFunctionType|undefined} tileLoadFunction Optional * @property {ol.TileLoadFunctionType|undefined} tileLoadFunction Optional
* function to load a tile given a URL. * function to load a tile given a URL.
* @todo stability experimental * @todo stability experimental
+1 -2
View File
@@ -1,2 +1 @@
@exportSymbol ol.source.MapQuestOSM @exportSymbol ol.source.MapQuest
@exportSymbol ol.source.MapQuestOpenAerial
+45 -42
View File
@@ -1,6 +1,6 @@
goog.provide('ol.source.MapQuestOSM'); goog.provide('ol.source.MapQuest');
goog.provide('ol.source.MapQuestOpenAerial');
goog.require('goog.asserts');
goog.require('ol.Attribution'); goog.require('ol.Attribution');
goog.require('ol.source.OSM'); goog.require('ol.source.OSM');
goog.require('ol.source.XYZ'); goog.require('ol.source.XYZ');
@@ -13,63 +13,66 @@ goog.require('ol.source.XYZ');
* @param {olx.source.MapQuestOptions=} opt_options MapQuest options. * @param {olx.source.MapQuestOptions=} opt_options MapQuest options.
* @todo stability experimental * @todo stability experimental
*/ */
ol.source.MapQuestOSM = function(opt_options) { ol.source.MapQuest = function(opt_options) {
var options = goog.isDef(opt_options) ? opt_options : {}; var options = goog.isDef(opt_options) ? opt_options : {};
goog.asserts.assert(options.layer in ol.source.MapQuestConfig);
var attributions = [ var layerConfig = ol.source.MapQuestConfig[options.layer];
new ol.Attribution({
html: 'Tiles Courtesy of ' + var url = 'http://otile{1-4}.mqcdn.com/tiles/1.0.0/' +
'<a href="http://www.mapquest.com/" target="_blank">MapQuest</a>' options.layer + '/{z}/{x}/{y}.jpg';
}),
ol.source.OSM.DATA_ATTRIBUTION
];
goog.base(this, { goog.base(this, {
attributions: attributions, attributions: layerConfig.attributions,
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
logo: 'http://developer.mapquest.com/content/osm/mq_logo.png', logo: 'http://developer.mapquest.com/content/osm/mq_logo.png',
maxZoom: layerConfig.maxZoom,
opaque: true, opaque: true,
maxZoom: 28,
tileLoadFunction: options.tileLoadFunction, tileLoadFunction: options.tileLoadFunction,
url: 'http://otile{1-4}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.jpg' url: url
}); });
}; };
goog.inherits(ol.source.MapQuestOSM, ol.source.XYZ); goog.inherits(ol.source.MapQuest, ol.source.XYZ);
/** /**
* @constructor * @const
* @extends {ol.source.XYZ} * @type {ol.Attribution}
* @param {olx.source.MapQuestOptions=} opt_options MapQuest options.
* @todo stability experimental
*/ */
ol.source.MapQuestOpenAerial = function(opt_options) { ol.source.MapQuest.TILE_ATTRIBUTION = new ol.Attribution({
html: 'Tiles Courtesy of ' +
'<a href="http://www.mapquest.com/" target="_blank">MapQuest</a>'
});
var options = goog.isDef(opt_options) ? opt_options : {};
var attributions = [ /**
new ol.Attribution({ * @type {Object.<string, {maxZoom: number, attributions: (Array.<ol.Attribution>)}>}
html: 'Tiles Courtesy of ' + */
'<a href="http://www.mapquest.com/" target="_blank">MapQuest</a>' ol.source.MapQuestConfig = {
}), 'osm': {
new ol.Attribution({ maxZoom: 28,
html: 'Portions Courtesy NASA/JPL-Caltech and ' + attributions: [
'U.S. Depart. of Agriculture, Farm Service Agency' ol.source.MapQuest.TILE_ATTRIBUTION,
}) ol.source.OSM.DATA_ATTRIBUTION
]; ]
},
goog.base(this, { 'sat': {
attributions: attributions,
crossOrigin: 'anonymous',
logo: 'http://developer.mapquest.com/content/osm/mq_logo.png',
maxZoom: 18, maxZoom: 18,
opaque: true, attributions: [
tileLoadFunction: options.tileLoadFunction, ol.source.MapQuest.TILE_ATTRIBUTION,
url: 'http://oatile{1-4}.mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.jpg' new ol.Attribution({
}); html: 'Portions Courtesy NASA/JPL-Caltech and ' +
'U.S. Depart. of Agriculture, Farm Service Agency'
})
]
},
'hyb': {
maxZoom: 18,
attributions: [
ol.source.MapQuest.TILE_ATTRIBUTION,
ol.source.OSM.DATA_ATTRIBUTION
]
}
}; };
goog.inherits(ol.source.MapQuestOpenAerial, ol.source.XYZ);