eurostat-map 4.0.9 → 4.0.10
Sign up to get free protection for your applications and to get access to all the features.
- 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
|
-
![npm bundle size](https://img.shields.io/bundlephobia/min/eurostat-map)
|
4
|
-
![npm](https://img.shields.io/npm/v/eurostat-map)
|
5
|
-
![license](https://img.shields.io/badge/license-EUPL-success)
|
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
|
|