Published
Edited
Jul 14, 2022
1 star
Insert cell
Insert cell
Insert cell
Insert cell
// chart_river
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// color = d3.scaleOrdinal().range(d3.schemeSet1)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
rawDates = d3.timeDay.range(new Date(2021, 1, 20), new Date(2021, 12, 18)) //此数据中的总日期范围
Insert cell
//Object.keys(rawData[0]).slice(11)
Insert cell
//rawData = d3.csv(
// "https://raw.githubusercontent.com/CSSEGISandData/COVID-19/master/csse_covid_19_data/csse_covid_19_time_series/time_series_covid19_confirmed_US.csv"
// )
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
data = Object.assign(d3.csvParse(await FileAttachment("typenum@4.csv").text(), d3.autoType))
Insert cell
datedata = Object.assign(d3.csvParse(await FileAttachment("typenum-4.csv").text(), d3.autoType)).map(d => {d.Date = new Date(d.Date); return d;})
Insert cell
datedata.columns = data.columns
Insert cell
data.columns.slice(1,data.columns.length)
Insert cell
series = d3.stack()
.keys(data.columns.slice(1,data.columns.length)) //关键词(按关键词堆叠
.order(d3.stackOrderDescending) // 将最大的系列放在底部
.offset(d3.stackOffsetSilhouette) //将流图以零为中心
(datedata)
Insert cell
truncatedseries = {
const data = series.map(d => d.slice(dateRange[0], dateRange[1]));
data.forEach((d, i) => (d.key = series[i].key));
return data;
}
//进度条截出来的数据
Insert cell
Insert cell
colorScale = d3.scaleOrdinal()
.domain(keys)
.range(d3.schemeTableau10); //括号里的是10中分类颜色的数组
//根据各关键词来设置河流颜色,一个关键词一个颜色
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell

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.
Learn more