Public
Edited
Jul 21, 2023
toc()
import {toc} from "@harrystevens/toc"
n_articles_data = FileAttachment("RefugeeANDTotalArticles.csv").csv()
n_articles_data_monthly = FileAttachment("RefugeeANDTotalArticles_Monthly.csv").csv()
viewof NumArticles = vl.markLine()
.data(n_articles_data)
.encode(
vl.x().fieldT("Year").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Year"}),
vl.y().fieldQ("Total_NUMARTS_REF").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Frequency"})
//.vl.tooltip()
//.vl.tooltip().fieldQ("NumArticles")
)
.width(700)
.height(250)
.title("Number of Articles about Refugees")
//.const tooltip = NumArticles.append("g");
.render()
viewof NumArticles2 = vl.markLine()
.data(n_articles_data)
.encode(
vl.x().fieldT("Year").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Year"}),
vl.y().fieldQ("Total_NUMARTS").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Frequency"})
//.vl.tooltip()
//.vl.tooltip().fieldQ("NumArticles")
)
.width(700)
.height(250)
.title("Number of Total Articles")
//.const tooltip = NumArticles.append("g");
.render()
viewof NumArticles_monthly = vl.markLine({ size: 4 } )
.data(n_articles_data_monthly)
.encode(
vl.x().fieldT("year_month").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:15, labelFont:"serif", titlePadding:20, title:"Year", tickCount: 28}).timeUnit("yearmonth"),
vl.y().fieldQ("Total_NUMARTS_REF").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Frequency"}),
//.vl.tooltip()
vl.tooltip([vl.fieldQ("Total_NUMARTS_REF"), vl.fieldT("year_month")]) //.fieldQ("Total_NUMARTS_REF").fieldT("year_month")
)
.width(500)
.height(250)
.title("Monthly Number of Articles about Refugees")
//.const tooltip = NumArticles.append("g");
.render()
viewof NumArticles_monthly2 = vl.markLine({ size: 4 })
.data(n_articles_data_monthly)
.encode(
vl.x().fieldT("year_month").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:15, labelFont:"serif", titlePadding:20, title:"Year", tickCount: 28}).timeUnit("yearmonth"),
vl.y().fieldQ("NUMARTS_Total").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Frequency"}),
vl.tooltip([vl.fieldQ("NUMARTS_Total"), vl.fieldT("year_month")]) //.fieldQ("Total_NUMARTS_REF").fieldT("year_month")
//.vl.tooltip()
//.vl.tooltip().fieldQ("NumArticles")
)
.width(500)
.height(250)
.title("Monthly Number of Total Articles")
//.const tooltip = NumArticles.append("g");
.render()
viewof population = vl.markBar({ size: 40 })
.data(population_data)
.encode(
vl.x().fieldN("Year").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:15, labelFont:"serif", titlePadding:20, title:"Year"}),
vl.y().fieldQ("REF_pupulation").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Population"}),
// vl.tooltip([vl.fieldQ("NUMARTS_Total"), vl.fieldT("year_month")]) //.fieldQ("Total_NUMARTS_REF").fieldT("year_month")
//.vl.tooltip()
//.vl.tooltip().fieldQ("NumArticles")
)
.width(400)
.height(250)
.title("Refugee Population Over Time")
//.const tooltip = NumArticles.append("g");
.render()
viewof total_population = vl.markBar({ size: 40 })
.data(population_data)
.encode(
vl.x().fieldN("Year").axis({grid: false, titleFont:"serif", titleFontSize:18, labelAngle:-90, labelFontSize:15, labelFont:"serif", titlePadding:20, title:"Year"}),
vl.y().fieldQ("Total_population").axis({grid: false, titleFont:"serif", titleFontSize:18, labelFontSize:14, labelFont:"serif", titlePadding:20, title:"Population"}),
// vl.tooltip([vl.fieldQ("NUMARTS_Total"), vl.fieldT("year_month")]) //.fieldQ("Total_NUMARTS_REF").fieldT("year_month")
//.vl.tooltip()
//.vl.tooltip().fieldQ("NumArticles")
)
.width(400)
.height(250)
.title("Total Population Over Time")
//.const tooltip = NumArticles.append("g");
.render()
countrydata = FileAttachment("stacked_chart_Hungary@1.csv").csv()
countrydata
region = FileAttachment("stacked_chart_EuropeCentralAsia.csv").csv()
vl.markBar()
.data(region)
.transform(
vl.calculate("datum.SourceCountryFIPS_Region == 'North America' ? 0 : 1")
.as("sort_order"))
.encode(
vl.x().fieldN('SemiAnnual'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'),
vl.order().fieldQ("sort_order"), // Sort by the custom "sort_order" field
vl.color().fieldN('SourceCountryFIPS_Region')
)
.title("News Propagation - About Europe & Central Asia Region")
.render();
vl.markBar()
.data(region_Q)
.transform(
vl.calculate("datum.SourceCountryFIPS_Region == 'North America' ? 0 : 1")
.as("sort_order")
)
.encode(
vl.x().fieldN('Quarterly'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'),
vl.order().fieldQ("sort_order"), // Sort by the custom "sort_order" field
vl.color().fieldN('SourceCountryFIPS_Region')
)
.title("News Propagation - About Europe & Central Asia Region")
.render();
vl.markBar()
.data(region_M)
.encode(
vl.x().fieldN('Monthly'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'), // y-axis is the value of those fold fields
vl.order().fieldQ("SourceCountryFIPS_Region", { // set order for the "SourceCountryFIPS" field
sort: ["North America"], // put "US" at the bottom
reverse: false // make "US" the bottom-most bar
}), // color is the fold field names
vl.color().fieldN('SourceCountryFIPS_Region')
)
.title("News Propagation - About Europe & Central Asia Region")
.render();
vl.markBar()
.data(region_M)
.transform(
vl.calculate("datum.SourceCountryFIPS_Region == 'North America' ? 0 : 1")
.as("sort_order")
)
.encode(
vl.x().fieldN('Monthly'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'), // y-axis is the value of those fold fields
vl.order().fieldQ("sort_order"),
vl.color().fieldN('SourceCountryFIPS_Region')
)
.title("News Propagation - About Europe & Central Asia Region")
.render();
nauru = FileAttachment("stacked_chart_Nauru_M@1.csv").csv()
vl.markBar()
.data(nauru)
.transform(
vl.calculate("datum.SourceCountryFIPS == 'US' ? 0 : 1") //to set which country/region is at the bottom
.as("sort_order")
)
.encode(
vl.x().fieldN('Monthly'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'), // y-axis is the value of those fold fields
vl.order().fieldQ("sort_order"), // Sort by the custom "sort_order" field
vl.color().fieldN('SourceCountryFIPS')
)
.config({
legend: { orient: 'bottom' } // Set legend orientation to horizontal and place it at the bottom
})
.title("News Propagation - About Nauru - Source Countries")
.height(700)
.render();
nauru_region = FileAttachment("stacked_chart_Nauru_RegionM@1.csv").csv()
vl.markBar()
.data(nauru_region)
.transform(
vl.calculate("datum.SourceCountryFIPS_Region == 'North America' ? 0 : 1")
.as("sort_order")
)
.encode(
vl.x().fieldN('Monthly'), // x-axis is countries
vl.y().fieldQ('Count').title('Number of Articles about Refugees'), // y-axis is the value of those fold fields
vl.order().fieldQ("sort_order"),
vl.color().fieldN('SourceCountryFIPS_Region')
)
.title("News Propagation - About Nauru - Source Regions")
.height(600)
.render();
import {vl} from "@vega/vega-lite-api"
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.
