Question

我正在使用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;
}

Answer 1

使用c3.js提供的宽度和高度属性api

C3.js定位和调整大小

1 个答案: