Rename _ol_layer_Heatmap_ to Heatmap
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import _ol_Map_ from '../src/ol/Map.js';
|
import _ol_Map_ from '../src/ol/Map.js';
|
||||||
import _ol_View_ from '../src/ol/View.js';
|
import _ol_View_ from '../src/ol/View.js';
|
||||||
import KML from '../src/ol/format/KML.js';
|
import KML from '../src/ol/format/KML.js';
|
||||||
import _ol_layer_Heatmap_ from '../src/ol/layer/Heatmap.js';
|
import HeatmapLayer from '../src/ol/layer/Heatmap.js';
|
||||||
import _ol_layer_Tile_ from '../src/ol/layer/Tile.js';
|
import _ol_layer_Tile_ from '../src/ol/layer/Tile.js';
|
||||||
import _ol_source_Stamen_ from '../src/ol/source/Stamen.js';
|
import _ol_source_Stamen_ from '../src/ol/source/Stamen.js';
|
||||||
import _ol_source_Vector_ from '../src/ol/source/Vector.js';
|
import _ol_source_Vector_ from '../src/ol/source/Vector.js';
|
||||||
@@ -9,7 +9,7 @@ import _ol_source_Vector_ from '../src/ol/source/Vector.js';
|
|||||||
var blur = document.getElementById('blur');
|
var blur = document.getElementById('blur');
|
||||||
var radius = document.getElementById('radius');
|
var radius = document.getElementById('radius');
|
||||||
|
|
||||||
var vector = new _ol_layer_Heatmap_({
|
var vector = new HeatmapLayer({
|
||||||
source: new _ol_source_Vector_({
|
source: new _ol_source_Vector_({
|
||||||
url: 'data/kml/2012_Earthquakes_Mag5.kml',
|
url: 'data/kml/2012_Earthquakes_Mag5.kml',
|
||||||
format: new KML({
|
format: new KML({
|
||||||
|
|||||||
+23
-24
@@ -24,6 +24,13 @@ var Property = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @const
|
||||||
|
* @type {Array.<string>}
|
||||||
|
*/
|
||||||
|
var DEFAULT_GRADIENT = ['#00f', '#0ff', '#0f0', '#ff0', '#f00'];
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @classdesc
|
* @classdesc
|
||||||
* Layer for rendering vector data as a heatmap.
|
* Layer for rendering vector data as a heatmap.
|
||||||
@@ -37,7 +44,7 @@ var Property = {
|
|||||||
* @param {olx.layer.HeatmapOptions=} opt_options Options.
|
* @param {olx.layer.HeatmapOptions=} opt_options Options.
|
||||||
* @api
|
* @api
|
||||||
*/
|
*/
|
||||||
var _ol_layer_Heatmap_ = function(opt_options) {
|
var Heatmap = function(opt_options) {
|
||||||
var options = opt_options ? opt_options : {};
|
var options = opt_options ? opt_options : {};
|
||||||
|
|
||||||
var baseOptions = _ol_obj_.assign({}, options);
|
var baseOptions = _ol_obj_.assign({}, options);
|
||||||
@@ -77,8 +84,7 @@ var _ol_layer_Heatmap_ = function(opt_options) {
|
|||||||
_ol_Object_.getChangeEventType(Property.GRADIENT),
|
_ol_Object_.getChangeEventType(Property.GRADIENT),
|
||||||
this.handleGradientChanged_, this);
|
this.handleGradientChanged_, this);
|
||||||
|
|
||||||
this.setGradient(options.gradient ?
|
this.setGradient(options.gradient ? options.gradient : DEFAULT_GRADIENT);
|
||||||
options.gradient : _ol_layer_Heatmap_.DEFAULT_GRADIENT);
|
|
||||||
|
|
||||||
this.setBlur(options.blur !== undefined ? options.blur : 15);
|
this.setBlur(options.blur !== undefined ? options.blur : 15);
|
||||||
|
|
||||||
@@ -130,14 +136,7 @@ var _ol_layer_Heatmap_ = function(opt_options) {
|
|||||||
_ol_events_.listen(this, _ol_render_EventType_.RENDER, this.handleRender_, this);
|
_ol_events_.listen(this, _ol_render_EventType_.RENDER, this.handleRender_, this);
|
||||||
};
|
};
|
||||||
|
|
||||||
inherits(_ol_layer_Heatmap_, _ol_layer_Vector_);
|
inherits(Heatmap, _ol_layer_Vector_);
|
||||||
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @const
|
|
||||||
* @type {Array.<string>}
|
|
||||||
*/
|
|
||||||
_ol_layer_Heatmap_.DEFAULT_GRADIENT = ['#00f', '#0ff', '#0f0', '#ff0', '#f00'];
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -145,7 +144,7 @@ _ol_layer_Heatmap_.DEFAULT_GRADIENT = ['#00f', '#0ff', '#0f0', '#ff0', '#f00'];
|
|||||||
* @return {Uint8ClampedArray} An array.
|
* @return {Uint8ClampedArray} An array.
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.createGradient_ = function(colors) {
|
var createGradient = function(colors) {
|
||||||
var width = 1;
|
var width = 1;
|
||||||
var height = 256;
|
var height = 256;
|
||||||
var context = createCanvasContext2D(width, height);
|
var context = createCanvasContext2D(width, height);
|
||||||
@@ -167,7 +166,7 @@ _ol_layer_Heatmap_.createGradient_ = function(colors) {
|
|||||||
* @return {string} Data URL for a circle.
|
* @return {string} Data URL for a circle.
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.createCircle_ = function() {
|
Heatmap.prototype.createCircle_ = function() {
|
||||||
var radius = this.getRadius();
|
var radius = this.getRadius();
|
||||||
var blur = this.getBlur();
|
var blur = this.getBlur();
|
||||||
var halfSize = radius + blur + 1;
|
var halfSize = radius + blur + 1;
|
||||||
@@ -190,7 +189,7 @@ _ol_layer_Heatmap_.prototype.createCircle_ = function() {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.getBlur = function() {
|
Heatmap.prototype.getBlur = function() {
|
||||||
return (/** @type {number} */ this.get(Property.BLUR));
|
return (/** @type {number} */ this.get(Property.BLUR));
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -201,7 +200,7 @@ _ol_layer_Heatmap_.prototype.getBlur = function() {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.getGradient = function() {
|
Heatmap.prototype.getGradient = function() {
|
||||||
return (/** @type {Array.<string>} */ this.get(Property.GRADIENT));
|
return (/** @type {Array.<string>} */ this.get(Property.GRADIENT));
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -212,7 +211,7 @@ _ol_layer_Heatmap_.prototype.getGradient = function() {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.getRadius = function() {
|
Heatmap.prototype.getRadius = function() {
|
||||||
return (/** @type {number} */ this.get(Property.RADIUS));
|
return (/** @type {number} */ this.get(Property.RADIUS));
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -220,15 +219,15 @@ _ol_layer_Heatmap_.prototype.getRadius = function() {
|
|||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.handleGradientChanged_ = function() {
|
Heatmap.prototype.handleGradientChanged_ = function() {
|
||||||
this.gradient_ = _ol_layer_Heatmap_.createGradient_(this.getGradient());
|
this.gradient_ = createGradient(this.getGradient());
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.handleStyleChanged_ = function() {
|
Heatmap.prototype.handleStyleChanged_ = function() {
|
||||||
this.circleImage_ = this.createCircle_();
|
this.circleImage_ = this.createCircle_();
|
||||||
this.styleCache_ = new Array(256);
|
this.styleCache_ = new Array(256);
|
||||||
this.changed();
|
this.changed();
|
||||||
@@ -239,7 +238,7 @@ _ol_layer_Heatmap_.prototype.handleStyleChanged_ = function() {
|
|||||||
* @param {ol.render.Event} event Post compose event
|
* @param {ol.render.Event} event Post compose event
|
||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.handleRender_ = function(event) {
|
Heatmap.prototype.handleRender_ = function(event) {
|
||||||
var context = event.context;
|
var context = event.context;
|
||||||
var canvas = context.canvas;
|
var canvas = context.canvas;
|
||||||
var image = context.getImageData(0, 0, canvas.width, canvas.height);
|
var image = context.getImageData(0, 0, canvas.width, canvas.height);
|
||||||
@@ -263,7 +262,7 @@ _ol_layer_Heatmap_.prototype.handleRender_ = function(event) {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.setBlur = function(blur) {
|
Heatmap.prototype.setBlur = function(blur) {
|
||||||
this.set(Property.BLUR, blur);
|
this.set(Property.BLUR, blur);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -274,7 +273,7 @@ _ol_layer_Heatmap_.prototype.setBlur = function(blur) {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.setGradient = function(colors) {
|
Heatmap.prototype.setGradient = function(colors) {
|
||||||
this.set(Property.GRADIENT, colors);
|
this.set(Property.GRADIENT, colors);
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -285,8 +284,8 @@ _ol_layer_Heatmap_.prototype.setGradient = function(colors) {
|
|||||||
* @api
|
* @api
|
||||||
* @observable
|
* @observable
|
||||||
*/
|
*/
|
||||||
_ol_layer_Heatmap_.prototype.setRadius = function(radius) {
|
Heatmap.prototype.setRadius = function(radius) {
|
||||||
this.set(Property.RADIUS, radius);
|
this.set(Property.RADIUS, radius);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default _ol_layer_Heatmap_;
|
export default Heatmap;
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import _ol_layer_Heatmap_ from '../../../../src/ol/layer/Heatmap.js';
|
import HeatmapLayer from '../../../../src/ol/layer/Heatmap.js';
|
||||||
|
|
||||||
|
|
||||||
describe('ol.layer.Heatmap', function() {
|
describe('ol.layer.Heatmap', function() {
|
||||||
@@ -6,8 +6,8 @@ describe('ol.layer.Heatmap', function() {
|
|||||||
describe('constructor', function() {
|
describe('constructor', function() {
|
||||||
|
|
||||||
it('can be constructed without arguments', function() {
|
it('can be constructed without arguments', function() {
|
||||||
var instance = new _ol_layer_Heatmap_();
|
var instance = new HeatmapLayer();
|
||||||
expect(instance).to.be.an(_ol_layer_Heatmap_);
|
expect(instance).to.be.an(HeatmapLayer);
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user