Learning D3.js 5 Mapping - Second Edition

Joining data points to the layout points

So far, we only had eyes for the base layer setup, visualising our layout points as hexagons. Now, we’ll finally add some real data to it. First, we need to fetch both data sources:

var usData = d3.json('data/us.json').then(function(us) { return us; });var marketData = d3.json('data/markets_overall.json').then(function(markets) { return markets; });Promise.all([usData, marketData]).then(function(response) {        var usResolved = response[0];        var marketsResolved = response[1];        ready(usResolved, marketsResolved);});

In the ready() function, we just add another line to our visualization pipeline, triggering a function that will prepare the data for us:

function ready(us) {  // … previous steps var dataPoints ...