我正在使用 C3.js 来可视化数据,但我不明白图表的定位和大小是如何工作的。
当我添加/初始化图表时,所有其他元素都会移动。换句话说:不可能在图表的水平面上放置任何元素。在将图表添加到页面之前,这不是问题。
我的 HTML 代码如下所示:
<div id = "ChartContainer">
</div>
我的 Javascript 代码如下所示:
var chart = c3.generate({
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250],
['data2', 50, 20, 10, 40, 15, 25]
]
}
});
我的 CSS 代码如下所示:
#ChartContainer {
height: 50%; width: 75%;
top: 0%; left: 25%;
position: absolute;
}
#otherElement {
height: 0%; width: 0%;
top: 0%; left: 0%;
background-color: blue;
position: absolute;
}