// data = FileAttachment("penguins.csv").csv({typed: true})
chart_a= {
// const svg= d3.create("svg")
// .attr("viewBox", ([0, 0, width , height +20]));
const svg= d3.create("svg").attr("viewBox", ([0, 0, width + 200, height - 100]))
const x= d3.scaleLinear()
.domain([0, d3.max( data, d=> d.Index)])
.range([0, 300])
// append the x-axis
svg.append("g")
.attr("transform", `translate(${ 0 }, ${ height/ 2})`)
.call(d3.axisBottom(x))
const y= d3.scaleLinear()
// .domain([0, d3.max(select_data_a, d => d.mean_xco2_anomaly)])
.domain([0, 1])
.range([200, 20])
svg.append("g")
// .attr("transform", `translate( ${width /2}, ${ 100})`)
.call(d3.axisLeft(y))
svg.selectAll(".line")
.data(data)
.append("path")
//.datum(data)
.attr("fill", "none")
// .attr("stroke", line_color)
.attr("stroke-width", 1.5)
.attr("d", d3.line()
.x(function(d) { return x(d.Index) })
.y(function(d) { return y(d.Air_Temp_at_2m) })
// (d.values)
)
return svg.node();
}
height= 400
data= FileAttachment("id_1_Australia.csv").csv()
d3= require("d3@6")
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.
