Published
Edited
Jan 26, 2021
Insert cell
Insert cell
Insert cell
Insert cell
data_by_departurestop = d3.group(data, d=>d['出发站'], d=>d['车次'])
Insert cell
Insert cell
data_by_date = d3.groups(data, d=>new Date(d['查询时间']).getDate())
Insert cell
data_by_date_17 = data_by_date[2]
Insert cell
// data_by_date_17[1].sort((a,b)=>b[1].length-a[1].length)
Insert cell
d3.groups(data_by_date_17[1],d=>d['出发站'],d=>d['到达站'],d=>d['车次']).sort((a,b)=>b[1].length-a[1].length)
Insert cell
d3.groups(data_by_date_17[1],d=>new Date(d['查询时间']).getHours())
Insert cell
Insert cell
data_by_destinationstop = d3.group(data, d=>d['到达站'], d=>d['出发站'])
Insert cell
Insert cell
data_by_train = d3.group(data, d=>d['车次'], d=>d['出发站'], d=>d['到达站'])
Insert cell
Insert cell
Insert cell
chart = {
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, 600]);
const globalG = svg.append('g')
.attr('id','global-g')
.attr('transform', `translate(${margin.left}, ${margin.top})`);
const circles = globalG.append('g')
.attr('id','circles-g')
.attr('class', 'circles')
.selectAll('circle')
.data(data_train_count)
.join('circle')
.attr('r', d=>rScale(d["车次数量"]))
.attr('fill', 'steelblue')
// forceSimulation.on('tick',()=>{
// circles
// .transition()
// .ease(d3.easeLinear)
// .attr('cx', d => d.x)
// .attr('cy', d => d.y);
// })
return svg.node();
}
Insert cell
forceSimulation = d3.forceSimulation()
.nodes(data_train_count)
.force('collision', d3.forceCollide().radius(d=> rScale(d["车次数量"])))
// .alphaTarget(10)
Insert cell
margin = ({top: 30, right: 30, left: 120, bottom: 30})
Insert cell
Insert cell
Insert cell
Insert cell
d3.rollup(data, v=>v.length, d=>d['到达站'], d=>d['出发站'], d=>d['车次'])
Insert cell
data_nested_map = d3.group(data, d=>d['出发站'], d=>d['到达站'], d=>d['车次'])
Insert cell
data_train_count = {
let obj_array = [];
data_nested_map.forEach((value_1, key_1)=>{
value_1.forEach((value_2, key_2)=>{
let obj={};
obj['出发站'] = key_1;
obj['到达站'] = key_2;
obj['车次数量'] = value_2.size
obj_array.push(obj)
})
})
obj_array.sort((a,b)=>b["车次数量"] - a["车次数量"])
return obj_array.filter(d=>d['出发站']=='武汉')
}
Insert cell
Insert cell
md`# Scale`
Insert cell
rScale = d3.scaleSqrt()
.domain(d3.extent(data_train_count, d => d["车次数量"]))
.range([1, 30])
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