Zingchart图表未填满父级div的宽度。

Question

我正在使用以下代码初始化一个zingChart。

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


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

柱状图渲染正确，但宽度似乎不符合父级 div 的要求。我已经检查过是否有任何设置高度和宽度的内容，但没有发现。当我在页面上缩放时（ctrl + 鼠标滚轮），图表会自动扩展以填充父级 div！谢谢。

- SegFaultDev

---

你能添加一个fiddle吗？这段代码并没有真正帮助。 - EugenSunic

当您缩小结果部分的高度或缩放页面时，图表将突然自动缩放以填充宽度。 - SegFaultDev

这个能解决你的问题吗？如果可以，那我会把它作为一个答案。http://jsfiddle.net/eugensunic/f29jn25b/16/ - EugenSunic

这个问题解决了，我尝试使用类(class)而不是ID来设置样式，嗯，现在它可以工作了！非常感谢你。 - SegFaultDev

Answer 1

为了解决你的问题（宽度突然改变），你应该使用 CSS 样式来设置你的 div：

#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
});

- EugenSunic