eurostat-map 4.0.8 → 4.0.10
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.
- package/README.md +87 -49
- package/build/eurostatmap.min.js +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,57 +1,82 @@
|
|
|
1
|
+
<div align="center">
|
|
2
|
+
|
|
1
3
|
# [eurostat-map](https://github.com/eurostat/eurostat-map)
|
|
2
4
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
Eurostat-map.js allows developers to quickly create and customise thematic web maps based on [NUTS regions](https://ec.europa.eu/eurostat/web/nuts/background), showing [Eurostat](https://ec.europa.eu/eurostat) data directly retrieved from the [Eurostat database](https://ec.europa.eu/eurostat/data/database), or custom data added manually.
|
|
8
|
-
|
|
9
|
-
<div>
|
|
10
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/population-density.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/ch.png" alt="choropleth" width="400"/> </a>
|
|
11
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/prop-circles.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/prop.png" alt="proportional circles" width="400"/></a>
|
|
12
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/prop-symbols.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/euro.png" alt="proportional symbols" width="400"/></a>
|
|
13
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/prop-piecharts.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/pie.png" alt="pie charts" width="400"/></a>
|
|
14
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/livestock_composition.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/stripe.png" alt="stripes" width="400"/></a>
|
|
15
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/pop-unemploy-bivariate.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/bivar.png" alt="bivariate choropleth" width="400"/></a>
|
|
16
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/categorical.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/cat.png" alt="categorical" width="400"/></a>
|
|
17
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/population-dot-density.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/dot.png" alt="dot density" width="400"/></a>
|
|
18
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/world.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/world.png" alt="dot density" width="400" height="70px"/></a>
|
|
19
|
-
<a href="https://eurostat.github.io/eurostat-map/examples/sparklines.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/previews/sparkline.png" alt="dot density" width="400" height="70px"/></a>
|
|
20
5
|
</div>
|
|
21
6
|
|
|
7
|
+
<div align="center">
|
|
8
|
+
<img src="https://img.shields.io/bundlephobia/min/eurostat-map" alt="npm bundle size">
|
|
9
|
+
<img src="https://img.shields.io/npm/v/eurostat-map" alt="npm">
|
|
10
|
+
<img src="https://img.shields.io/badge/license-EUPL-success" alt="license">
|
|
11
|
+
</div>
|
|
12
|
+
|
|
13
|
+
<div align="center">
|
|
14
|
+
<em>Customizable thematic maps.</em>
|
|
15
|
+
</div>
|
|
16
|
+
<div align="center">
|
|
17
|
+
<em>Based on D3 and designed for Eurostat data but compatible with custom geometries and stats.</em>
|
|
18
|
+
</div>
|
|
19
|
+
|
|
20
|
+
<br>
|
|
21
|
+
|
|
22
|
+
<div align="center">
|
|
23
|
+
<a href="https://eurostat.github.io/eurostat-map/examples/population-density.html" target="_blank"> <img src="https://raw.githubusercontent.com/eurostat/eurostat-map/master/docs/img/examples.gif" alt="examples" width="600"/> </a>
|
|
24
|
+
</div>
|
|
25
|
+
|
|
26
|
+
---
|
|
27
|
+
|
|
28
|
+
## Table of Contents
|
|
29
|
+
|
|
30
|
+
- [eurostat-map](#eurostat-map)
|
|
31
|
+
- [Table of Contents](#table-of-contents)
|
|
32
|
+
- [Examples](#examples)
|
|
33
|
+
- [Installation](#installation)
|
|
34
|
+
- [Node.js](#nodejs)
|
|
35
|
+
- [Standalone](#standalone)
|
|
36
|
+
- [Documentation](#documentation)
|
|
37
|
+
- [Technical details](#technical-details)
|
|
38
|
+
- [About](#about)
|
|
39
|
+
- [Contribute](#contribute)
|
|
40
|
+
- [Copyright](#copyright)
|
|
41
|
+
- [Disclaimer](#disclaimer)
|
|
42
|
+
|
|
43
|
+
---
|
|
44
|
+
|
|
22
45
|
## Examples
|
|
23
46
|
|
|
24
47
|
You can build an interactive statistical map with just a few lines of code:
|
|
25
48
|
|
|
26
49
|
```javascript
|
|
27
50
|
eurostatmap
|
|
28
|
-
.map('choropleth')
|
|
29
|
-
.title('Population density in Europe')
|
|
30
|
-
.stat({ eurostatDatasetCode: 'demo_r_d3dens', unitText: 'people/km²' })
|
|
31
|
-
.legend({ x: 500, y: 180, title: 'Density, people/km²' })
|
|
32
|
-
.build()
|
|
51
|
+
.map('choropleth') // Specify the map type
|
|
52
|
+
.title('Population density in Europe') // Add a title
|
|
53
|
+
.stat({ eurostatDatasetCode: 'demo_r_d3dens', unitText: 'people/km²' }) // Configure dataset
|
|
54
|
+
.legend({ x: 500, y: 180, title: 'Density, people/km²' }) // Add a legend
|
|
55
|
+
.build() // Build the map
|
|
33
56
|
```
|
|
34
57
|
|
|
35
|
-
-
|
|
36
|
-
-
|
|
37
|
-
-
|
|
38
|
-
-
|
|
39
|
-
-
|
|
40
|
-
-
|
|
41
|
-
-
|
|
42
|
-
-
|
|
43
|
-
-
|
|
44
|
-
-
|
|
45
|
-
-
|
|
46
|
-
-
|
|
47
|
-
-
|
|
48
|
-
-
|
|
58
|
+
- [Population density](https://eurostat.github.io/eurostat-map/examples/population-density.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/population-density.html))
|
|
59
|
+
- [Population density map with dot pattern](https://eurostat.github.io/eurostat-map/examples/population-dot-density.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/population-dot-density.html))
|
|
60
|
+
- [Population map with proportional circles](https://eurostat.github.io/eurostat-map/examples/prop-circles.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/prop-circles.html))
|
|
61
|
+
- [GDP map with custom proportional symbols](https://eurostat.github.io/eurostat-map/examples/prop-symbols.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/prop-symbols.html))
|
|
62
|
+
- [Causes of death with proportional pie charts](https://eurostat.github.io/eurostat-map/examples/prop-piecharts.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/prop-piecharts.html))
|
|
63
|
+
- [Population change ](https://eurostat.github.io/eurostat-map/examples/population-change.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/population-change.html))
|
|
64
|
+
- [NUTS typology as a categorical map](https://eurostat.github.io/eurostat-map/examples/categorical.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/categorical.html))
|
|
65
|
+
- [Focus on Spain](https://eurostat.github.io/eurostat-map/examples/spain.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/spain.html))
|
|
66
|
+
- [20 years of GDP change in Europe](https://eurostat.github.io/eurostat-map/examples/small_multiple.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/small_multiple.html))
|
|
67
|
+
- [Unemployment/population relation](https://eurostat.github.io/eurostat-map/examples/pop-unemploy-bivariate.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/pop-unemploy-bivariate.html))
|
|
68
|
+
- [Farm sizes composition](https://eurostat.github.io/eurostat-map/examples/farm_size.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/farm_size.html))
|
|
69
|
+
- [Livestock composition](https://eurostat.github.io/eurostat-map/examples/livestock_composition.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/livestock_composition.html))
|
|
70
|
+
- [Sparklines: Population in Europe since 2012](https://eurostat.github.io/eurostat-map/examples/sparklines.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/sparklines.html))
|
|
71
|
+
- [World map](https://eurostat.github.io/eurostat-map/examples/world.html) (see [the code](https://github.com/eurostat/eurostat-map/blob/master/examples/world.html))
|
|
49
72
|
|
|
50
73
|
## Installation
|
|
51
74
|
|
|
52
75
|
### Node.js
|
|
53
76
|
|
|
54
|
-
|
|
77
|
+
```npm
|
|
78
|
+
npm install eurostatmap
|
|
79
|
+
```
|
|
55
80
|
|
|
56
81
|
then
|
|
57
82
|
|
|
@@ -67,23 +92,36 @@ eurostatmap = require('eurostatmap')
|
|
|
67
92
|
|
|
68
93
|
### Standalone
|
|
69
94
|
|
|
70
|
-
|
|
71
|
-
|
|
95
|
+
For the latest version, use:
|
|
96
|
+
|
|
97
|
+
```html
|
|
98
|
+
<script src="https://unpkg.com/eurostat-map"></script>
|
|
99
|
+
```
|
|
100
|
+
|
|
101
|
+
For a fixed version, use:
|
|
102
|
+
|
|
103
|
+
```html
|
|
104
|
+
<script src="https://unpkg.com/eurostat-map@X.Y.Z"></script>
|
|
105
|
+
```
|
|
106
|
+
|
|
107
|
+
where X.Y.Z is a [version number](https://www.npmjs.com/package/eurostat-map?activeTab=versions).
|
|
72
108
|
|
|
73
109
|
## Documentation
|
|
74
110
|
|
|
111
|
+
For detailed documentation see the **[API reference page](docs/reference.md)**.
|
|
112
|
+
|
|
75
113
|
For a quick tutorial check out this notebook:
|
|
76
114
|
https://observablehq.com/@joewdavies/eurostat-map-js
|
|
77
115
|
|
|
78
|
-
|
|
116
|
+
Code examples:
|
|
79
117
|
|
|
80
|
-
-
|
|
81
|
-
-
|
|
82
|
-
-
|
|
83
|
-
-
|
|
84
|
-
-
|
|
85
|
-
-
|
|
86
|
-
-
|
|
118
|
+
- For a [choropleth map](docs/reference.md#choropleth-map),
|
|
119
|
+
- For a [proportional symbol map](docs/reference.md#proportional-symbol-map),
|
|
120
|
+
- For a [proportional pie chart map](docs/reference.md#proportional-pie-chart-map),
|
|
121
|
+
- For a [categorical map](docs/reference.md#categorical-map).
|
|
122
|
+
- For a [bivariate choropleth map](docs/reference.md#bivariate-choropleth-map).
|
|
123
|
+
- For a [stripe composition map](docs/reference.md#stripe-composition-map).
|
|
124
|
+
- For a [sparkline map](docs/reference.md#sparkline-map).
|
|
87
125
|
|
|
88
126
|
Anything unclear or missing? Feel free to [ask](https://github.com/eurostat/eurostat.js/issues/new) !
|
|
89
127
|
|
|
@@ -100,9 +138,9 @@ Maps based on [NUTS regions](http://ec.europa.eu/eurostat/web/nuts/overview) rel
|
|
|
100
138
|
| _status_ | Since 2018 |
|
|
101
139
|
| _license_ | [EUPL 1.2](https://github.com/eurostat/Nuts2json/blob/master/LICENSE) |
|
|
102
140
|
|
|
103
|
-
##
|
|
141
|
+
## Contribute
|
|
104
142
|
|
|
105
|
-
Feel free to [ask
|
|
143
|
+
Feel free to [ask for assistance](https://github.com/eurostat/eurostat.js/issues/new), fork the project or simply star it (it's always a pleasure).
|
|
106
144
|
|
|
107
145
|
## Copyright
|
|
108
146
|
|