gridviz 2.0.45 → 2.0.46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/README.md +119 -119
  2. package/dist/gridviz.js +6937 -6937
  3. package/package.json +76 -76
  4. package/src/App.js +668 -668
  5. package/src/BackgroundLayer.js +182 -182
  6. package/src/BackgroundLayerWMS.js +131 -131
  7. package/src/Dataset.js +76 -76
  8. package/src/DatasetComponent.js +101 -101
  9. package/src/GeoCanvas.js +420 -420
  10. package/src/LabelLayer.js +190 -190
  11. package/src/Layer.js +92 -92
  12. package/src/Legend.js +86 -86
  13. package/src/LineLayer.js +150 -150
  14. package/src/Style.js +114 -114
  15. package/src/Tooltip.js +172 -172
  16. package/src/dataset/COGeo.js +24 -24
  17. package/src/dataset/CSVGrid.js +104 -104
  18. package/src/dataset/GeoTIFF.js +127 -127
  19. package/src/dataset/GridTile.js +41 -41
  20. package/src/dataset/TiledGrid.js +264 -264
  21. package/src/index.js +177 -176
  22. package/src/legend/ColorCategoryLegend.js +124 -124
  23. package/src/legend/ColorDiscreteLegend.js +103 -103
  24. package/src/legend/ColorLegend.js +124 -124
  25. package/src/legend/SegmentOrientationLegend.js +87 -87
  26. package/src/legend/SegmentWidthLegend.js +97 -97
  27. package/src/legend/SizeLegend.js +141 -141
  28. package/src/style/CompositionStyle.js +300 -300
  29. package/src/style/ContourStyle.js +54 -54
  30. package/src/style/DotDensityStyle.js +156 -156
  31. package/src/style/JoyPlotStyle.js +135 -135
  32. package/src/style/LegoStyle.js +112 -112
  33. package/src/style/MosaicStyle.js +107 -107
  34. package/src/style/NinjaStarStyle.js +124 -124
  35. package/src/style/PillarStyle.js +230 -230
  36. package/src/style/SegmentStyle.js +142 -142
  37. package/src/style/ShapeColorSizeStyle.js +126 -126
  38. package/src/style/SideCatStyle.js +172 -172
  39. package/src/style/SideStyle.js +218 -218
  40. package/src/style/SquareColorCatWGLStyle.js +120 -120
  41. package/src/style/SquareColorWGLStyle.js +146 -146
  42. package/src/style/StrokeStyle.js +131 -131
  43. package/src/style/TanakaStyle.js +160 -160
  44. package/src/style/TextStyle.js +132 -132
  45. package/src/utils/Utils.js +35 -35
  46. package/src/utils/WebGLRectangleColoring.js +106 -106
  47. package/src/utils/WebGLSquareColoring.js +118 -118
  48. package/src/utils/WebGLSquareColoringAdvanced.js +230 -230
  49. package/src/utils/WebGLSquareColoringCatAdvanced.js +133 -133
  50. package/src/utils/WebGLSquareColoringKS.js +153 -153
  51. package/src/utils/stretching.js +131 -131
  52. package/src/utils/webGLUtils.js +71 -71
  53. package/src/utils/zoomUtils.js +142 -142
package/README.md CHANGED
@@ -1,119 +1,119 @@
1
- # Gridviz
2
-
3
- ![npm bundle size](https://img.shields.io/bundlephobia/minzip/gridviz)
4
- ![npm](https://img.shields.io/npm/v/gridviz)
5
- ![license](https://img.shields.io/badge/license-EUPL-success)
6
-
7
- [Gridviz](https://github.com/eurostat/gridviz/) is a JavaScript library to visualise gridded data (or any tabular dataset with x/y position) in the browser in a large variety of advanced cartographic styles. Unlike traditional raster-based web mapping tools, [Gridviz](https://github.com/eurostat/gridviz/) renders everything client-side, on the fly.
8
-
9
- [![](/docs/img/overviews/ov_accessibility.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
10
- [![](/docs/img/overviews/ov_side_cat.png)](https://eurostat.github.io/gridviz/docs/reference#side-category-style)
11
- [![](/docs/img/overviews/ov_age_balance.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
12
- [![shadow effect map](/docs/img/overviews/ov_choco.png)](https://eurostat.github.io/gridviz/docs/reference#side-style)
13
- [![](/docs/img/overviews/ov_dark.png)](https://eurostat.github.io/gridviz/docs/reference#square-color-webgl-style)
14
- [![](/docs/img/overviews/ov_kersmoo.png)](https://eurostat.github.io/gridviz/docs/reference#kernel-smoothing)
15
- [![](/docs/img/overviews/ov_pillar_simple.png)](https://eurostat.github.io/gridviz/docs/reference#pillars-style)
16
- [![](/docs/img/overviews/ov_donut.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
17
- [![tanaka style map](/docs/img/overviews/ov_tanaka_dark.png)](https://eurostat.github.io/gridviz/docs/reference#tanaka-style)
18
- [![](/docs/img/overviews/ov_flag.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
19
- [![joyplot map](/docs/img/overviews/ov_joyplot_shade.png)](https://eurostat.github.io/gridviz/docs/reference#joyplot-style)
20
- [![lego map](/docs/img/overviews/ov_lego.png)](https://eurostat.github.io/gridviz/docs/reference#lego-style)
21
- [![mosaic map](/docs/img/overviews/ov_mosaic.png)](https://eurostat.github.io/gridviz/docs/reference#mosaic-style)
22
- [![](/docs/img/overviews/ov_piechart.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
23
- [![](/docs/img/overviews/ov_pillar.png)](https://eurostat.github.io/gridviz/docs/reference#pillars-style)
24
- [![](/docs/img/overviews/ov_text_elevation.png)](https://eurostat.github.io/gridviz/docs/reference#text-style)
25
- [![dot density map](/docs/img/overviews/ov_dotdensity_random.png)](https://eurostat.github.io/gridviz/docs/reference#dot-density-style)
26
- [![](/docs/img/overviews/ov_popchange.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
27
- [![](/docs/img/overviews/ov_ring.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
28
- [![](/docs/img/overviews/ov_segment.png)](https://eurostat.github.io/gridviz/docs/reference#segment-style)
29
- [![tanaka style map](/docs/img/overviews/ov_tanaka.png)](https://eurostat.github.io/gridviz/docs/reference#tanaka-style)
30
- [![dot density map](/docs/img/overviews/ov_dotdensity.png)](https://eurostat.github.io/gridviz/docs/reference#dot-density-style)
31
- [![joyplot map](/docs/img/overviews/ov_joyplot.png)](https://eurostat.github.io/gridviz/docs/reference#joyplot-style)
32
-
33
- ## Examples
34
-
35
- - [Europe - 1km resolution - GEOSTAT/GISCO](https://eurostat.github.io/gridviz/examples/EUR.html)
36
- - [France - 200m resolution - INSEE Filosofi](https://eurostat.github.io/gridviz/examples/FR.html)
37
- - [Croatia - 1km resolution - DZS 2015 grid](https://eurostat.github.io/gridviz/examples/HR.html)
38
- - [France population, dark style](https://eurostat.github.io/gridviz/examples/styles/squarecolorwgl_dark.html)
39
- - [Europe population as a mosaic](https://eurostat.github.io/gridviz/examples/styles/mosaic_full.html)
40
-
41
- ## Installation
42
-
43
- ### Node.js
44
-
45
- ```Shell
46
- npm install gridviz
47
- ```
48
-
49
- then
50
-
51
- ```javascript
52
- import * as gridviz from 'gridviz'
53
- ```
54
-
55
- Or you can cherry-pick only the modules that you need, for example:
56
-
57
- ```javascript
58
- import { App, SquareColorWGLStyle } from 'gridviz'
59
- ```
60
-
61
- ### Basic example
62
-
63
- Here’s a basic example that loads a CSV file of a European population grid (5km resolution):
64
-
65
- ```javascript
66
- let myApp = new gridviz.App(containerDiv)
67
- //set position and zoom
68
- .setGeoCenter({ x: 4500000, y: 2900000 })
69
- .setZoomFactor(3000)
70
- //add CSV layer
71
- .addCSVGridLayer(
72
- //data URL
73
- 'https://raw.githubusercontent.com/eurostat/gridviz/master/assets/csv/Europe/pop_2018_5km.csv',
74
- //resolution, in CRS unit (m)
75
- 5000,
76
- //the style
77
- [
78
- new gridviz.SquareColorWGLStyle({
79
- //the CSV column to show
80
- colorCol: 'Population',
81
- //value to [0,1] mapping function
82
- tFun: (value) => gridviz.sExp(Math.min(value / 100000, 1), -15),
83
- }),
84
- ]
85
- )
86
- ```
87
-
88
- See the **[documentation page](https://eurostat.github.io/gridviz/docs/reference)** for more information.
89
-
90
- ### standalone
91
-
92
- ```javascript
93
- <script src="https://unpkg.com/gridviz/dist/gridviz.min.js"></script>
94
- ```
95
-
96
- ## Documentation
97
-
98
- See the **[API reference](https://eurostat.github.io/gridviz/docs/reference)**.
99
-
100
- ## About
101
-
102
- | | |
103
- | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
104
- | _contributors_ | [<img src="https://github.com/jgaffuri.png" height="40" />](https://github.com/jgaffuri) [<img src="https://github.com/JoeWDavies.png" height="40" />](https://github.com/JoeWDavies) |
105
- | _version_ | See [npm](https://www.npmjs.com/package/gridviz?activeTab=versions) |
106
- | _status_ | Since 2020 |
107
- | _license_ | [EUPL 1.2](LICENSE) |
108
-
109
- ### Support and contribution
110
-
111
- Feel free to [ask support](https://github.com/eurostat/gridviz/issues/new), fork the project or simply star it (it's always a pleasure).
112
-
113
- ### Copyright
114
-
115
- The [Eurostat NUTS dataset](http://ec.europa.eu/eurostat/web/nuts/overview) is copyrighted. There are [specific provisions](https://ec.europa.eu/eurostat/web/gisco/geodata/reference-data/administrative-units-statistical-units) for the usage of this dataset which must be respected. The usage of these data is subject to their acceptance. See the [Eurostat-GISCO website](http://ec.europa.eu/eurostat/web/gisco/geodata/reference-data/administrative-units-statistical-units/nuts) for more information.
116
-
117
- ### Disclaimer
118
-
119
- The designations employed and the presentation of material on these maps do not imply the expression of any opinion whatsoever on the part of the European Union concerning the legal status of any country, territory, city or area or of its authorities, or concerning the delimitation of its frontiers or boundaries. Kosovo*: This designation is without prejudice to positions on status, and is in line with UNSCR 1244/1999 and the ICJ Opinion on the Kosovo declaration of independence. Palestine*: This designation shall not be construed as recognition of a State of Palestine and is without prejudice to the individual positions of the Member States on this issue.
1
+ # Gridviz
2
+
3
+ ![npm bundle size](https://img.shields.io/bundlephobia/minzip/gridviz)
4
+ ![npm](https://img.shields.io/npm/v/gridviz)
5
+ ![license](https://img.shields.io/badge/license-EUPL-success)
6
+
7
+ [Gridviz](https://github.com/eurostat/gridviz/) is a JavaScript library to visualise gridded data (or any tabular dataset with x/y position) in the browser in a large variety of advanced cartographic styles. Unlike traditional raster-based web mapping tools, [Gridviz](https://github.com/eurostat/gridviz/) renders everything client-side, on the fly.
8
+
9
+ [![](/docs/img/overviews/ov_accessibility.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
10
+ [![](/docs/img/overviews/ov_side_cat.png)](https://eurostat.github.io/gridviz/docs/reference#side-category-style)
11
+ [![](/docs/img/overviews/ov_age_balance.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
12
+ [![shadow effect map](/docs/img/overviews/ov_choco.png)](https://eurostat.github.io/gridviz/docs/reference#side-style)
13
+ [![](/docs/img/overviews/ov_dark.png)](https://eurostat.github.io/gridviz/docs/reference#square-color-webgl-style)
14
+ [![](/docs/img/overviews/ov_kersmoo.png)](https://eurostat.github.io/gridviz/docs/reference#kernel-smoothing)
15
+ [![](/docs/img/overviews/ov_pillar_simple.png)](https://eurostat.github.io/gridviz/docs/reference#pillars-style)
16
+ [![](/docs/img/overviews/ov_donut.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
17
+ [![tanaka style map](/docs/img/overviews/ov_tanaka_dark.png)](https://eurostat.github.io/gridviz/docs/reference#tanaka-style)
18
+ [![](/docs/img/overviews/ov_flag.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
19
+ [![joyplot map](/docs/img/overviews/ov_joyplot_shade.png)](https://eurostat.github.io/gridviz/docs/reference#joyplot-style)
20
+ [![lego map](/docs/img/overviews/ov_lego.png)](https://eurostat.github.io/gridviz/docs/reference#lego-style)
21
+ [![mosaic map](/docs/img/overviews/ov_mosaic.png)](https://eurostat.github.io/gridviz/docs/reference#mosaic-style)
22
+ [![](/docs/img/overviews/ov_piechart.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
23
+ [![](/docs/img/overviews/ov_pillar.png)](https://eurostat.github.io/gridviz/docs/reference#pillars-style)
24
+ [![](/docs/img/overviews/ov_text_elevation.png)](https://eurostat.github.io/gridviz/docs/reference#text-style)
25
+ [![dot density map](/docs/img/overviews/ov_dotdensity_random.png)](https://eurostat.github.io/gridviz/docs/reference#dot-density-style)
26
+ [![](/docs/img/overviews/ov_popchange.png)](https://eurostat.github.io/gridviz/docs/reference#shapecolorsize-style)
27
+ [![](/docs/img/overviews/ov_ring.png)](https://eurostat.github.io/gridviz/docs/reference#composition-style)
28
+ [![](/docs/img/overviews/ov_segment.png)](https://eurostat.github.io/gridviz/docs/reference#segment-style)
29
+ [![tanaka style map](/docs/img/overviews/ov_tanaka.png)](https://eurostat.github.io/gridviz/docs/reference#tanaka-style)
30
+ [![dot density map](/docs/img/overviews/ov_dotdensity.png)](https://eurostat.github.io/gridviz/docs/reference#dot-density-style)
31
+ [![joyplot map](/docs/img/overviews/ov_joyplot.png)](https://eurostat.github.io/gridviz/docs/reference#joyplot-style)
32
+
33
+ ## Examples
34
+
35
+ - [Europe - 1km resolution - GEOSTAT/GISCO](https://eurostat.github.io/gridviz/examples/EUR.html)
36
+ - [France - 200m resolution - INSEE Filosofi](https://eurostat.github.io/gridviz/examples/FR.html)
37
+ - [Croatia - 1km resolution - DZS 2015 grid](https://eurostat.github.io/gridviz/examples/HR.html)
38
+ - [France population, dark style](https://eurostat.github.io/gridviz/examples/styles/squarecolorwgl_dark.html)
39
+ - [Europe population as a mosaic](https://eurostat.github.io/gridviz/examples/styles/mosaic_full.html)
40
+
41
+ ## Installation
42
+
43
+ ### Node.js
44
+
45
+ ```Shell
46
+ npm install gridviz
47
+ ```
48
+
49
+ then
50
+
51
+ ```javascript
52
+ import * as gridviz from 'gridviz'
53
+ ```
54
+
55
+ Or you can cherry-pick only the modules that you need, for example:
56
+
57
+ ```javascript
58
+ import { App, SquareColorWGLStyle } from 'gridviz'
59
+ ```
60
+
61
+ ### Basic example
62
+
63
+ Here’s a basic example that loads a CSV file of a European population grid (5km resolution):
64
+
65
+ ```javascript
66
+ let myApp = new gridviz.App(containerDiv)
67
+ //set position and zoom
68
+ .setGeoCenter({ x: 4500000, y: 2900000 })
69
+ .setZoomFactor(3000)
70
+ //add CSV layer
71
+ .addCSVGridLayer(
72
+ //data URL
73
+ 'https://raw.githubusercontent.com/eurostat/gridviz/master/assets/csv/Europe/pop_2018_5km.csv',
74
+ //resolution, in CRS unit (m)
75
+ 5000,
76
+ //the style
77
+ [
78
+ new gridviz.SquareColorWGLStyle({
79
+ //the CSV column to show
80
+ colorCol: 'Population',
81
+ //value to [0,1] mapping function
82
+ tFun: (value) => gridviz.sExp(Math.min(value / 100000, 1), -15),
83
+ }),
84
+ ]
85
+ )
86
+ ```
87
+
88
+ See the **[documentation page](https://eurostat.github.io/gridviz/docs/reference)** for more information.
89
+
90
+ ### standalone
91
+
92
+ ```javascript
93
+ <script src="https://unpkg.com/gridviz/dist/gridviz.min.js"></script>
94
+ ```
95
+
96
+ ## Documentation
97
+
98
+ See the **[API reference](https://eurostat.github.io/gridviz/docs/reference)**.
99
+
100
+ ## About
101
+
102
+ | | |
103
+ | -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
104
+ | _contributors_ | [<img src="https://github.com/jgaffuri.png" height="40" />](https://github.com/jgaffuri) [<img src="https://github.com/JoeWDavies.png" height="40" />](https://github.com/JoeWDavies) |
105
+ | _version_ | See [npm](https://www.npmjs.com/package/gridviz?activeTab=versions) |
106
+ | _status_ | Since 2020 |
107
+ | _license_ | [EUPL 1.2](LICENSE) |
108
+
109
+ ### Support and contribution
110
+
111
+ Feel free to [ask support](https://github.com/eurostat/gridviz/issues/new), fork the project or simply star it (it's always a pleasure).
112
+
113
+ ### Copyright
114
+
115
+ The [Eurostat NUTS dataset](http://ec.europa.eu/eurostat/web/nuts/overview) is copyrighted. There are [specific provisions](https://ec.europa.eu/eurostat/web/gisco/geodata/reference-data/administrative-units-statistical-units) for the usage of this dataset which must be respected. The usage of these data is subject to their acceptance. See the [Eurostat-GISCO website](http://ec.europa.eu/eurostat/web/gisco/geodata/reference-data/administrative-units-statistical-units/nuts) for more information.
116
+
117
+ ### Disclaimer
118
+
119
+ The designations employed and the presentation of material on these maps do not imply the expression of any opinion whatsoever on the part of the European Union concerning the legal status of any country, territory, city or area or of its authorities, or concerning the delimitation of its frontiers or boundaries. Kosovo*: This designation is without prejudice to positions on status, and is in line with UNSCR 1244/1999 and the ICJ Opinion on the Kosovo declaration of independence. Palestine*: This designation shall not be construed as recognition of a State of Palestine and is without prejudice to the individual positions of the Member States on this issue.