Merge pull request #274 from tschaub/utfgrid
UTFGrid Tile, Layer, and Control. This adds support for responsive handling of interactions with large numbers of features represented by UTFGrids.
This commit is contained in:
@@ -419,6 +419,64 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Method: getTileData
|
||||
* Given a map location, retrieve a tile and the pixel offset within that
|
||||
* tile corresponding to the location. If there is not an existing
|
||||
* tile in the grid that covers the given location, null will be
|
||||
* returned.
|
||||
*
|
||||
* Parameters:
|
||||
* loc - {<OpenLayers.LonLat>} map location
|
||||
*
|
||||
* Returns:
|
||||
* {Object} Object with the following properties: tile ({<OpenLayers.Tile>}),
|
||||
* i ({Number} x-pixel offset from top left), and j ({Integer} y-pixel
|
||||
* offset from top left).
|
||||
*/
|
||||
getTileData: function(loc) {
|
||||
var data = null,
|
||||
x = loc.lon,
|
||||
y = loc.lat,
|
||||
numRows = this.grid.length;
|
||||
|
||||
if (this.map && numRows) {
|
||||
var res = this.map.getResolution(),
|
||||
tileWidth = this.tileSize.w,
|
||||
tileHeight = this.tileSize.h,
|
||||
bounds = this.grid[0][0].bounds,
|
||||
left = bounds.left,
|
||||
top = bounds.top;
|
||||
|
||||
if (x < left) {
|
||||
// deal with multiple worlds
|
||||
if (this.map.baseLayer.wrapDateLine) {
|
||||
var worldWidth = this.map.getMaxExtent().getWidth();
|
||||
var worldsAway = Math.ceil((left - x) / worldWidth);
|
||||
x += worldWidth * worldsAway;
|
||||
}
|
||||
}
|
||||
// tile distance to location (fractional number of tiles);
|
||||
var dtx = (x - left) / (res * tileWidth);
|
||||
var dty = (top - y) / (res * tileHeight);
|
||||
// index of tile in grid
|
||||
var col = Math.floor(dtx);
|
||||
var row = Math.floor(dty);
|
||||
if (row >= 0 && row < numRows) {
|
||||
var tile = this.grid[row][col];
|
||||
if (tile) {
|
||||
data = {
|
||||
tile: tile,
|
||||
// pixel index within tile
|
||||
i: Math.floor((dtx - col) * tileWidth),
|
||||
j: Math.floor((dty - row) * tileHeight)
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
return data;
|
||||
},
|
||||
|
||||
/**
|
||||
* Method: queueTileDraw
|
||||
|
||||
178
lib/OpenLayers/Layer/UTFGrid.js
Normal file
178
lib/OpenLayers/Layer/UTFGrid.js
Normal file
@@ -0,0 +1,178 @@
|
||||
/* Copyright (c) 2006-2012 by OpenLayers Contributors (see authors.txt for
|
||||
* full list of contributors). Published under the Clear BSD license.
|
||||
* See http://svn.openlayers.org/trunk/openlayers/license.txt for the
|
||||
* full text of the license. */
|
||||
|
||||
/**
|
||||
* @requires OpenLayers/Layer/XYZ.js
|
||||
* @requires OpenLayers/Tile/UTFGrid.js
|
||||
*/
|
||||
|
||||
/**
|
||||
* Class: OpenLayers.Layer.UTFGrid
|
||||
* This Layer reads from UTFGrid tiled data sources. Since UTFGrids are
|
||||
* essentially JSON-based ASCII art with attached attributes, they are not
|
||||
* visibly rendered. In order to use them in the map, you must add a
|
||||
* <OpenLayers.Control.UTFGrid> ontrol as well.
|
||||
*
|
||||
* Example:
|
||||
*
|
||||
* (start code)
|
||||
* var world_utfgrid = new OpenLayers.Layer.UTFGrid({
|
||||
* url: "/tiles/world_utfgrid/${z}/${x}/${y}.json",
|
||||
* utfgridResolution: 4,
|
||||
* displayInLayerSwitcher: false
|
||||
* );
|
||||
* map.addLayer(world_utfgrid);
|
||||
*
|
||||
* var control = new OpenLayers.Control.UTFGrid({
|
||||
* layers: [world_utfgrid],
|
||||
* handlerMode: 'move',
|
||||
* callback: function(dataLookup) {
|
||||
* // do something with returned data
|
||||
* }
|
||||
* })
|
||||
* (end code)
|
||||
*
|
||||
*
|
||||
* Inherits from:
|
||||
* - <OpenLayers.Layer.XYZ>
|
||||
*/
|
||||
OpenLayers.Layer.UTFGrid = OpenLayers.Class(OpenLayers.Layer.XYZ, {
|
||||
|
||||
/**
|
||||
* APIProperty: isBaseLayer
|
||||
* Default is true, as this is designed to be a base tile source.
|
||||
*/
|
||||
isBaseLayer: false,
|
||||
|
||||
/**
|
||||
* APIProperty: projection
|
||||
* {<OpenLayers.Projection>}
|
||||
* Source projection for the UTFGrids. Default is "EPSG:900913".
|
||||
*/
|
||||
projection: new OpenLayers.Projection("EPSG:900913"),
|
||||
|
||||
/**
|
||||
* Property: useJSONP
|
||||
* {Boolean}
|
||||
* Should we use a JSONP script approach instead of a standard AJAX call?
|
||||
*
|
||||
* Set to true for using utfgrids from another server.
|
||||
* Avoids same-domain policy restrictions.
|
||||
* Note that this only works if the server accepts
|
||||
* the callback GET parameter and dynamically
|
||||
* wraps the returned json in a function call.
|
||||
*
|
||||
* Default is false
|
||||
*/
|
||||
useJSONP: false,
|
||||
|
||||
/**
|
||||
* APIProperty: url
|
||||
* {String}
|
||||
* URL tempate for UTFGrid tiles. Include x, y, and z parameters.
|
||||
* E.g. "/tiles/${z}/${x}/${y}.json"
|
||||
*/
|
||||
|
||||
/**
|
||||
* APIProperty: utfgridResolution
|
||||
* {Number}
|
||||
* Ratio of the pixel width to the width of a UTFGrid data point. If an
|
||||
* entry in the grid represents a 4x4 block of pixels, the
|
||||
* utfgridResolution would be 4. Default is 2 (specified in
|
||||
* <OpenLayers.Tile.UTFGrid>).
|
||||
*/
|
||||
|
||||
/**
|
||||
* Property: tileClass
|
||||
* {<OpenLayers.Tile>} The tile class to use for this layer.
|
||||
* Defaults is <OpenLayers.Tile.UTFGrid>.
|
||||
*/
|
||||
tileClass: OpenLayers.Tile.UTFGrid,
|
||||
|
||||
/**
|
||||
* Constructor: OpenLayers.Layer.UTFGrid
|
||||
* Create a new UTFGrid layer.
|
||||
*
|
||||
* Parameters:
|
||||
* config - {Object} Configuration properties for the layer.
|
||||
*
|
||||
* Required configuration properties:
|
||||
* url - {String} The url template for UTFGrid tiles. See the <url> property.
|
||||
*/
|
||||
initialize: function(options) {
|
||||
OpenLayers.Layer.Grid.prototype.initialize.apply(
|
||||
this, [options.name, options.url, {}, options]
|
||||
);
|
||||
this.tileOptions = OpenLayers.Util.extend({
|
||||
utfgridResolution: this.utfgridResolution
|
||||
}, this.tileOptions);
|
||||
},
|
||||
|
||||
/**
|
||||
* APIMethod: clone
|
||||
* Create a clone of this layer
|
||||
*
|
||||
* Parameters:
|
||||
* obj - {Object} Only used by a subclass of this layer.
|
||||
*
|
||||
* Returns:
|
||||
* {<OpenLayers.Layer.UTFGrid>} An exact clone of this OpenLayers.Layer.UTFGrid
|
||||
*/
|
||||
clone: function (obj) {
|
||||
if (obj == null) {
|
||||
obj = new OpenLayers.Layer.UTFGrid(this.getOptions());
|
||||
}
|
||||
|
||||
// get all additions from superclasses
|
||||
obj = OpenLayers.Layer.Grid.prototype.clone.apply(this, [obj]);
|
||||
|
||||
return obj;
|
||||
},
|
||||
|
||||
/**
|
||||
* APIProperty: getFeatureInfo
|
||||
* Get details about a feature associated with a map location. The object
|
||||
* returned will have id and data properties. If the given location
|
||||
* doesn't correspond to a feature, null will be returned.
|
||||
*
|
||||
* Parameters:
|
||||
* location - {<OpenLayers.LonLat>} map location
|
||||
*
|
||||
* Returns:
|
||||
* {Object} Object representing the feature id and UTFGrid data
|
||||
* corresponding to the given map location. Returns null if the given
|
||||
* location doesn't hit a feature.
|
||||
*/
|
||||
getFeatureInfo: function(location) {
|
||||
var info = null;
|
||||
var tileInfo = this.getTileData(location);
|
||||
if (tileInfo.tile) {
|
||||
info = tileInfo.tile.getFeatureInfo(tileInfo.i, tileInfo.j);
|
||||
}
|
||||
return info;
|
||||
},
|
||||
|
||||
/**
|
||||
* APIMethod: getFeatureId
|
||||
* Get the identifier for the feature associated with a map location.
|
||||
*
|
||||
* Parameters:
|
||||
* location - {<OpenLayers.LonLat>} map location
|
||||
*
|
||||
* Returns:
|
||||
* {String} The feature identifier corresponding to the given map location.
|
||||
* Returns null if the location doesn't hit a feature.
|
||||
*/
|
||||
getFeatureId: function(location) {
|
||||
var id = null;
|
||||
var info = this.getTileData(location);
|
||||
if (info.tile) {
|
||||
id = info.tile.getFeatureId(info.i, info.j);
|
||||
}
|
||||
return id;
|
||||
},
|
||||
|
||||
CLASS_NAME: "OpenLayers.Layer.UTFGrid"
|
||||
});
|
||||
Reference in New Issue
Block a user