Add type definitions for heatmap.js

This commit is contained in:
Yang Guan
2014-10-31 00:25:51 -07:00
parent 1fa34a5449
commit 0573a8bf5d
2 changed files with 176 additions and 0 deletions
+42
View File
@@ -0,0 +1,42 @@
/// <reference path="heatmap.d.ts" />
var baseLayer = L.tileLayer(
'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>',
maxZoom: 18
});
var testData: HeatmapDataObject = {
max: 8,
data: [
{
lat: 24.6408,
lng:46.7728,
count: 3
}, {
lat: 50.75,
lng: -1.55,
count: 1
}
]
};
var config : HeatmapConfiguration = {
radius: 2,
maxOpacity: .8,
scaleRadius: true,
useLocalExtrema: true,
latField: 'lat',
lngField: 'lng',
valueField: 'count'
};
var heatmapLayer = new HeatmapOverlay(config);
var map = new L.Map('map-canvas', {
center: new L.LatLng(25.6586, -80.3568),
zoom: 4,
layers: [baseLayer, heatmapLayer]
});
heatmapLayer.setData(testData);
+134
View File
@@ -0,0 +1,134 @@
// Type definitions for heatmap.js v2.0
// Project: https://github.com/pa7/heatmap.js/
// Definitions by: Yang Guan <https://github.com/lookuptable>
// Definitions: https://github.com/borisyankov/DefinitelyTyped
/// <reference path="../leaflet/leaflet.d.ts" />
/*
* Configuration object of a heatmap
*/
interface HeatmapConfiguration {
/*
* A background color string in form of hexcode, color name, or rgb(a)
*/
backgroundColor?: string;
/*
* An object that represents the gradient
*/
gradient?: any;
/*
* The radius each datapoint will have (if not specified on the datapoint
* itself)
*/
radius?: number;
/*
* The radius each datapoint will have (if not specified on the datapoint
* itself)
*/
useLocalExtrema?: boolean;
/*
* A global opacity for the whole heatmap. This overrides maxOpacity and
* minOpacity if set
*/
opacity?: number;
/*
* The maximal opacity the highest value in the heatmap will have. (will be
* overridden if opacity set)
* Default value: 0.6
*/
maxOpacity?: number;
/*
* The minimum opacity the lowest value in the heatmap will have (will be
* overridden if opacity set)
*/
minOpacity?: number;
/*
* The blur factor that will be applied to all datapoints. The higher the
* blur factor is, the smoother the gradients will be
* Default value: 0.85
*/
blur?: number;
/*
* The property name of your latitude coordinate in a datapoint
* Default value: 'x'
*/
latField?: string;
/*
* The property name of your longitude coordinate in a datapoint
* Default value: 'y'
*/
lngField?: string;
/*
* The property name of your y coordinate in a datapoint
*/
valueField: string;
}
/*
* A single data point on a heatmap. The keys are specified by
* HeatmapConfig.latField, HeatmapConfig.lngField and HeatmapConfig.valueField
*/
interface HeatmapDataPoint {
[index: string] : number;
}
/*
* An object representing the set of data points on a heatmap.
*/
interface HeatmapDataObject {
/*
* Max value of of the valueField
*/
max?: number;
/*
* Min value of of the valueField
*/
min?: number;
/*
* An array of HeatmapDataPoints
*/
data: HeatmapDataPoint[];
}
/*
* The overlay layer to be added onto leaflet map
*/
declare class HeatmapOverlay {
/*
* Initialization function
*/
constructor(configuration: HeatmapConfiguration)
/*
* Create DOM elements for othe overlay, adding them to map panes and
* puts listeners on relevant map events
*/
onAdd(map: L.Map): void;
/*
* Remove the overlay's elements from the DOM and remove listeners
* previously added by onAdd()
*/
onRemove(map: L.Map): void;
/*
* Initialize a heatmap instance with the given dataset
*/
setData(data: {}): void;
}