Zingchart图表没有填充父div的宽度

时间:2015-07-24 20:27:34

标签: javascript jquery html marionette zingchart

所以我使用以下代码初始化zingChart。

barChartData = 
        "type":"bar"
        "series":[
            "values":[11,16,7,-14,11,24,-42,26,]
        ]


    $("#performance-bar-chart").zingchart(
        data: barChartData
    )

条形图正确呈现,但宽度似乎与父div无关。我已经检查了是否有任何设置高度和宽度但没有任何东西。

当我在页面上放大或缩小(ctrl +鼠标滚动)时,图表会自动扩展以填充父div!

谢谢,

1 个答案:

答案 0 :(得分:7)

要解决您的问题(突然改变宽度),您应该使用

设置div的样式

CSS:

#myChart {
    width:100%;
    height:300px;
}

这是你的JS和HTML,以防小提琴消失。

HTML:

 <div id="myChart"></div>

JS:

 // Data for the chart
var barChartData = {
    type: "bar",
    series: [{  values: [3,7,10,2,6,5]} ]
};

// Make your chart
$("#myChart").zingchart({
    data: barChartData
});