I decided to create my own data to use for this project. Was quite a bit of work to take JSON data from a website, reconfigure it to be used in this project. It’s the 2016 presidential race. Each area is broken down by state, then by republican/democrat. The candidate with the most votes sets the color for that state. Thoughts?
Link:
code I used to extract the data to be used for the treemap:
const treeData = {
name: "vote data",
children: []
}
const candidates = ["Hillary Clinton", "Donald Trump"];
const states = [];
const oneState = ["Delaware"]
const url = "https://raw.githubusercontent.com/booshay/temp/master/2016.json";
const dataRemote = fetch(url).then(res => res.json()).then(data => {
data.map((e, i) => {
if (states.indexOf(e.state) == -1) {
states.push(e.state);
}
})
states.map((s) => {
const stateData = [];
candidates.map((n) => {
let cVotes = 0;
let arr = []
data.map((c, j) => {
if (c.state == s && c.candidate == n) {
cVotes = cVotes + Number(c.candidatevotes)
}
})
stateData.push({ votes: cVotes, state: s, candidate: n })
})
let winner = stateData[0].votes > stateData[1].votes ? "blue" : "red"
console.log(winner)
treeData.children.push({ state: s, children: stateData, winner: winner })
})
document.getElementById("output").innerHTML = JSON.stringify(treeData)
})