Percentage on height and width ZingChart does not work accordingly

Whenever I set the height and width of a ZingChart as a percentage so that it is compatible with all screen sizes, it does not affect. Example: if I set the height to 1% and the width to 1%, nothing happens. I change the height and width as:

zingchart.render({ 
id : 'myChart', 
data : myConfig, 
height: '1%', 
width: '1%' 
 });

You can view the full code here:   http://jsfiddle.net/xbh2ap18/

+4
source share
1 answer

The height and width of the ZingChart are inherited from the parent container that you are joining. 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>
Run codeHide result
+7

Source: https://habr.com/ru/post/1611874/


All Articles