Javascript 当画布图表的容器'；s的大小是动态变化的？

首先看看这个例子

window.onload=函数（）{
var chart=new CanvasJS.chart（“chartContainer”{
animationEnabled：没错，
exportEnabled:true，
主题：“light1”、“light1”、“light2”、“dark1”、“dark2”
标题：{
文本：“带索引标签的简单柱状图”
},
数据：[{
类型：“列”，//将类型更改为条形、直线、面积、饼图等
//indexLabel:“{y}”，//在所有数据点上显示y值
indexLabelFontColor:#5A5757“，
indexLabelPlacement:“外部”，
数据点：[
{x:10，y:71}，
{x:20，y:55}，
{x:30，y:50}，
{x:40，y:65}，
{x:50，y:92，索引标签：“最高”}，
{x:60，y:68}，
{x:70，y:38}，
{x:80，y:71}，
{x:90，y:54}，
{x:100，y:60}，
{x:110，y:36}，
{x:120，y:49}，
{x:130，y:21，索引标签：“最低”}
]
}]
});
chart.render（）；
}

。侧栏{
背景色：黑色；
宽度：150px；
位置：绝对位置；
排名：0；
左：0；
底部：0；
}
.侧边栏h1{
颜色：白色；
}
.投资组合{
背景色：红色；
位置：绝对位置；
排名：0；
左：150px；
右：0；
底部：0；
-moz过渡：左0.5s轻松；
过渡：左0.5s；
}
输入[类型=复选框]{
显示：无；
}
输入：选中~.portfolio{
左：0；
}
输入：选中~标签{
左：0；
}
标签{
z指数：2；
位置：绝对位置；
排名：0；
左：150px；
背景颜色：蓝色；
-moz过渡：左0.5s轻松；
过渡：左0.5s；
}

关闭
设置

呈现图表的功能由

onload

事件触发

只需提取该函数定义，将其命名为，例如，

render

，并为

onresize

事件触发相同的函数

---

@MerajAhmed添加了在单击“关闭”按钮时触发渲染函数的代码。这是一个使用

setTimeout

的简单示例，但它应该足以让您开始。是的，我理解。但它重新呈现了图表。其大小在动画期间不会更改。如果尝试调整浏览器窗口的大小，图表将自动调整大小，而无需在“我的代码笔”中重新渲染。我希望这里也有同样的效果。我想你应该有足够的能力来解决这个问题。

window.onload = render;
window.onresize = render;