Прежде всего, я использую ReactJS и библиотеку heatmap.js.
HTMLDivElement, используемый в качестве точки входа heatmap.js, должен быть отзывчивым.При каждом изменении размера окна оно корректируется в зависимости от текущего размера окна.
Однако холст, созданный библиотечным объектом heatmap.js, принимает начальные размеры div, поэтому его размер остается прежним.
Как я могу сделать так, чтобы дочерний холст тоже реагировал?
Файл heatmap.js config JSON выглядит следующим образом:
this.heatmap = Heatmap.create({
container: this.image
});
Переменная this.image является ссылкой на HTMLDivElement , что ей динамически присваиваются атрибуты width и height.
<div style={{ width: `${width}px`, height:`${height}px`}} />
* Если вы не знакомы с синтаксисом JSXЯ мог бы преобразовать его в простой HTML / CSS / JS.