Whenever I am setting height and width of ZingChart in percentage, so that it's compatible with all screen sizes, it has no effect. Example: If I set 1% height and 1% width, nothing as such happens. I am changing height and width as:
zingchart.render({
id : 'myChart',
data : myConfig,
height: '1%',
width: '1%'
});
You can view the complete code here: http://jsfiddle.net/xbh2ap18/
ZingChart's height and width inherits from the parent container that you are attaching to. The actual chart is a child of myChart, so you will need to apply css to your container.
zingchart.render({
id : 'myChart',
data : {
type:"line",
series :[
{ values : [1,2,3,4] }
]
},
height: "100%",
width: "100%"
});
html,body,#myChart{
height: 100%;
width: 100%;
}
<!DOCTYPE html>
<html>
<head>
<script src= "https://cdn.zingchart.com/zingchart.min.js"></script>
</head>
<body>
<div id='myChart'></div>
</body>
</html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With