Lead maintainer of of d3-x3d.
bars2 = {
let chartHolder = d3.select(document.createElement("div"));
chartHolder.attr("style", "height: 420px");
// Construct components
let bars = d3X3d.component.bars()
.colors(colors);
let viewpoint = d3X3d.component.viewpoint();
// Create x3d and scene
let scene = chartHolder
.append("X3D")
.attr("width", width + "px")
.attr("height", height + "px")
.append("Scene");
// Append components to scene
scene
.datum(data[0])
.call(bars);
scene
.call(viewpoint);
return chartHolder.node();
}
bars3 = {
let chartHolder = d3.select(document.createElement("div"));
chartHolder.attr("style", "height: 420px");
// Construct components
let bars = d3X3d.component.barsMultiSeries()
.colors(colors);
let viewpoint = d3X3d.component.viewpoint();
// Create x3d and scene
let scene = chartHolder
.append("X3D")
.attr("id", "axis")
.attr("width", width + "px")
.attr("height", height + "px")
.append("Scene");
// Append components to scene
scene
.append("Group")
.datum(data)
.call(bars);
scene
.call(viewpoint);
return chartHolder.node();
}
bars4 = {
let chartHolder = d3.select(document.createElement("div"));
chartHolder.attr("style", "height: 420px");
// Construct components
let axis = d3X3d.component.axisThreePlane()
.xScale(xScale)
.yScale(yScale)
.zScale(zScale);
let bars = d3X3d.component.barsMultiSeries()
.colors(colors);
let viewpoint = d3X3d.component.viewpoint();
// Create x3d and scene
let scene = chartHolder
.append("X3D")
.attr("id", "axis")
.attr("width", width + "px")
.attr("height", height + "px")
.append("Scene");
// Append components to scene
scene
.append("Group")
.call(axis);
scene
.append("Group")
.datum(data)
.call(bars);
scene
.call(viewpoint);
return chartHolder.node();
}
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.
