D3.js - d3.geo API: Unterschied zwischen den Versionen
Aus Wikizone
Steff (Diskussion | Beiträge) |
Steff (Diskussion | Beiträge) |
||
| Zeile 7: | Zeile 7: | ||
https://github.com/d3/d3-geo (d3/d3-geo Erweiterung) | https://github.com/d3/d3-geo (d3/d3-geo Erweiterung) | ||
== Beispiele == | == Beispiele == | ||
| + | == Troubleshooting == | ||
| + | === Mehrere JSON Dateien laden === | ||
| + | Hier sollte man zuerst die Daten über einen Queue laden. Wenn nicht kann man die Projection nicht zuverlässig anwenden. | ||
| + | http://bl.ocks.org/mapsam/6090056 | ||
| + | <pre> | ||
| + | queue() | ||
| + | .defer(d3.json, 'states.json') | ||
| + | .defer(d3.json, 'cities.json') | ||
| + | .await(makeMyMap); | ||
| + | function makeMyMap(error, states, cities) { | ||
| + | svg.append('path') | ||
| + | .datum(topojson.feature(states, states.objects.usStates)) | ||
| + | .attr('d', path) | ||
| + | .attr('class', 'states'); | ||
| + | svg.selectAll('.cities') | ||
| + | .data(cities.features) | ||
| + | .enter() | ||
| + | .append('path') | ||
| + | .attr('d', path.pointRadius(5)) | ||
| + | .attr('class', 'cities'); | ||
| + | } | ||
| + | </pre> | ||
Version vom 23. Oktober 2018, 14:04 Uhr
Siehe auch:
d3.js
Links
http://enjalot.github.io/intro-d3/maptime/geo/#data // http://bl.ocksplorer.org/#/search/d3.geo http://enjalot.github.io/intro-d3/maptime/examples/ https://github.com/d3/d3-geo (d3/d3-geo Erweiterung)
Beispiele
Troubleshooting
Mehrere JSON Dateien laden
Hier sollte man zuerst die Daten über einen Queue laden. Wenn nicht kann man die Projection nicht zuverlässig anwenden.
http://bl.ocks.org/mapsam/6090056
queue()
.defer(d3.json, 'states.json')
.defer(d3.json, 'cities.json')
.await(makeMyMap);
function makeMyMap(error, states, cities) {
svg.append('path')
.datum(topojson.feature(states, states.objects.usStates))
.attr('d', path)
.attr('class', 'states');
svg.selectAll('.cities')
.data(cities.features)
.enter()
.append('path')
.attr('d', path.pointRadius(5))
.attr('class', 'cities');
}
