UW iSchool Course INFO 474: focused on designing and building visualizations to better understand and communicate about pressing issues.
Published
Edited
Jun 9, 2020
Importers
1 star
/*
import { user_data, geo_artists, songData, countries } from '@info474/last-fm-final-data-source-group-12'
*/
geo_artists = {
let all_artists = [];
geo_data.forEach(d => {
for (let i = 0; i < d.artists.length; i++) {
let cur = d.artists[i];
all_artists.push({
artist: cur.artist_name,
country: d.country,
code: d.code,
rank: i + 1,
listeners: cur.listeners,
url: cur.url
});
}
});
let geo_artists = d3_array.group(all_artists, d => d.artist);
geo_artists = Array.from(geo_artists, d => ({
artist: d[0],
countries: d[1]
}));
geo_artists = geo_artists.sort(
(a, b) => b.countries.length - a.countries.length
);
geo_artists.forEach(d => {
d.countries.sort((a, b) => a.ranking - b.ranking);
});
return geo_artists;
}
songData = async function(track, artist) {
const url = song_info_url.replace("???", artist).replace("%%%", track);
var track_info = await d3.json(url);
const song_data = {};
if (track_info == null || track_info.message != null) {
song_data["track"] = "Track not found: " + track;
song_data["url"] = "";
song_data["artist"] = artist;
song_data["artist_url"] = "";
song_data["listeners"] = -1;
song_data["playcount"] = -1;
song_data["tags"] = [];
song_data["similar"] = [];
song_data["countries"] = [];
} else {
const inf = track_info.track;
song_data["track"] = inf.name;
song_data["url"] = inf.url;
song_data["artist"] = inf.artist.name;
song_data["artist_url"] = inf.artist.url;
song_data["listeners"] = parseInt(inf.listeners);
song_data["playcount"] = parseInt(inf.playcount);
song_data["tags"] = inf.toptags.tag;
song_data["similar"] = await similar_tracks(track, artist);
song_data["countries"] = await get_countries_for_song(
inf.name,
inf.artist.name
);
}
return song_data;
}
user_data = {
const csv = await FileAttachment("demographics@2.csv").text();
var user_data = d3.csvParse(csv);
user_data = user_data
.map(d => {
var country = countries.filter(x => x.code == d.country)[0];
return {
playcount: parseFloat(d.playcount),
gender: d.gender,
age: parseInt(d.age),
account_age: parseInt(d.account_age),
country: country.name,
code: country.code
};
});
user_data = user_data.sort((a, b) => a.playcount - b.playcount);
return user_data;
}
await songData("Mr. Brightside", "The Killers")
geo_data
user_data
d3 = require("d3")
d3_array = require("d3-array")
_ = require("lodash")
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
