C3.js позиционирование и изменение размера

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