From 0573a8bf5d76b261f71ef4f6576d036ca0e3de59 Mon Sep 17 00:00:00 2001 From: Yang Guan Date: Fri, 31 Oct 2014 00:25:51 -0700 Subject: [PATCH 1/5] Add type definitions for heatmap.js --- heatmap.js/heatmap-tests.ts | 42 +++++++++++ heatmap.js/heatmap.d.ts | 134 ++++++++++++++++++++++++++++++++++++ 2 files changed, 176 insertions(+) create mode 100644 heatmap.js/heatmap-tests.ts create mode 100644 heatmap.js/heatmap.d.ts diff --git a/heatmap.js/heatmap-tests.ts b/heatmap.js/heatmap-tests.ts new file mode 100644 index 000000000..c61458fae --- /dev/null +++ b/heatmap.js/heatmap-tests.ts @@ -0,0 +1,42 @@ +/// + +var baseLayer = L.tileLayer( + 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: 'Map data © OpenStreetMap contributors, CC-BY-SA, Imagery © CloudMade', + 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); diff --git a/heatmap.js/heatmap.d.ts b/heatmap.js/heatmap.d.ts new file mode 100644 index 000000000..bff76db98 --- /dev/null +++ b/heatmap.js/heatmap.d.ts @@ -0,0 +1,134 @@ +// Type definitions for heatmap.js v2.0 +// Project: https://github.com/pa7/heatmap.js/ +// Definitions by: Yang Guan +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +/// + +/* + * 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; +} From 05896329891138898edee72177aefa1e3482453d Mon Sep 17 00:00:00 2001 From: Yang Guan Date: Fri, 31 Oct 2014 12:20:52 -0700 Subject: [PATCH 2/5] Update contributor list --- CONTRIBUTORS.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CONTRIBUTORS.md b/CONTRIBUTORS.md index 234fdad56..197492f8b 100644 --- a/CONTRIBUTORS.md +++ b/CONTRIBUTORS.md @@ -140,6 +140,7 @@ All definitions files include a header with the author and editors, so at some p * [HashMap](https://github.com/flesler/hashmap) (by [Rafał Wrzeszcz](https://wrzasq.pl)) * [HashSet](http://www.timdown.co.uk/jshashtable/jshashset.html) (by [Sergey Gerasimov](https://github.com/gerich-home)) * [Hashtable](http://www.timdown.co.uk/jshashtable/) (by [Sergey Gerasimov](https://github.com/gerich-home)) +* [heatmap.js](https://github.com/pa7/heatmap.js/) (by [Yang Guan](https://github.com/lookuptable)) * [HelloJS](http://adodson.com/hello.js) (by [Pavel Zika](https://github.com/PavelPZ)) * [Highcharts](http://www.highcharts.com/) (by [damianog](https://github.com/damianog)) * [Highland](http://highlandjs.org/) (by [Bart van der Schoor](https://github.com/Bartvds/)) From 5c44d00ca60516e637e93283eb0ca02bc0781a78 Mon Sep 17 00:00:00 2001 From: Yang Guan Date: Tue, 4 Nov 2014 15:18:20 -0800 Subject: [PATCH 3/5] Correct a comment --- heatmap.js/heatmap.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/heatmap.js/heatmap.d.ts b/heatmap.js/heatmap.d.ts index bff76db98..04b038c25 100644 --- a/heatmap.js/heatmap.d.ts +++ b/heatmap.js/heatmap.d.ts @@ -27,8 +27,8 @@ interface HeatmapConfiguration { radius?: number; /* - * The radius each datapoint will have (if not specified on the datapoint - * itself) + * Indicate whether the heatmap should use a global extrema or a local + * extrema (the maximum and minimum of the currently displayed viewport) */ useLocalExtrema?: boolean; From 0a16b7f522b801a0eb741eea4cf9ed74d5f67e1f Mon Sep 17 00:00:00 2001 From: Yang Guan Date: Tue, 4 Nov 2014 17:00:14 -0800 Subject: [PATCH 4/5] Put variables into alphabetical order --- heatmap.js/heatmap.d.ts | 78 ++++++++++++++++++++--------------------- 1 file changed, 39 insertions(+), 39 deletions(-) diff --git a/heatmap.js/heatmap.d.ts b/heatmap.js/heatmap.d.ts index 04b038c25..012e3f9d9 100644 --- a/heatmap.js/heatmap.d.ts +++ b/heatmap.js/heatmap.d.ts @@ -15,28 +15,29 @@ interface HeatmapConfiguration { */ backgroundColor?: string; + /* + * 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; + /* * An object that represents the gradient */ gradient?: any; /* - * The radius each datapoint will have (if not specified on the datapoint - * itself) + * The property name of your latitude coordinate in a datapoint + * Default value: 'x' */ - radius?: number; + latField?: string; /* - * Indicate whether the heatmap should use a global extrema or a local - * extrema (the maximum and minimum of the currently displayed viewport) + * The property name of your longitude coordinate in a datapoint + * Default value: 'y' */ - useLocalExtrema?: boolean; - - /* - * A global opacity for the whole heatmap. This overrides maxOpacity and - * minOpacity if set - */ - opacity?: number; + lngField?: string; /* * The maximal opacity the highest value in the heatmap will have. (will be @@ -52,26 +53,25 @@ interface HeatmapConfiguration { 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 + * A global opacity for the whole heatmap. This overrides maxOpacity and + * minOpacity if set */ - blur?: number; + opacity?: number; /* - * The property name of your latitude coordinate in a datapoint - * Default value: 'x' + * The radius each datapoint will have (if not specified on the datapoint + * itself) */ - latField?: string; + radius?: number; /* - * The property name of your longitude coordinate in a datapoint - * Default value: 'y' + * Indicate whether the heatmap should use a global extrema or a local + * extrema (the maximum and minimum of the currently displayed viewport) */ - lngField?: string; + useLocalExtrema?: boolean; /* - * The property name of your y coordinate in a datapoint + * The property name of the value/weight in a datapoint */ valueField: string; } @@ -81,28 +81,28 @@ interface HeatmapConfiguration { * HeatmapConfig.latField, HeatmapConfig.lngField and HeatmapConfig.valueField */ interface HeatmapDataPoint { - [index: string] : number; + [index: string]: number; } /* - * An object representing the set of data points on a heatmap. + * 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; +interface HeatmapData { /* * An array of HeatmapDataPoints */ data: HeatmapDataPoint[]; + + /* + * Max value of the valueField + */ + max?: number; + + /* + * Min value of the valueField + */ + min?: number; } /* @@ -116,8 +116,8 @@ declare class HeatmapOverlay { constructor(configuration: HeatmapConfiguration) /* - * Create DOM elements for othe overlay, adding them to map panes and - * puts listeners on relevant map events + * Create DOM elements for an overlay, adding them to map panes and puts + * listeners on relevant map events */ onAdd(map: L.Map): void; @@ -130,5 +130,5 @@ declare class HeatmapOverlay { /* * Initialize a heatmap instance with the given dataset */ - setData(data: {}): void; + setData(data: HeatmapData): void; } From 59ea3f230968073885dc9f72bcb66747b737f2e5 Mon Sep 17 00:00:00 2001 From: Yang Guan Date: Thu, 6 Nov 2014 10:23:22 -0800 Subject: [PATCH 5/5] Modify tests for heatmap.js --- heatmap.js/heatmap-tests.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/heatmap.js/heatmap-tests.ts b/heatmap.js/heatmap-tests.ts index c61458fae..a90eb0aea 100644 --- a/heatmap.js/heatmap-tests.ts +++ b/heatmap.js/heatmap-tests.ts @@ -6,7 +6,7 @@ var baseLayer = L.tileLayer( maxZoom: 18 }); -var testData: HeatmapDataObject = { +var testData: HeatmapData = { max: 8, data: [ {