height - ZingChart 的高度和宽度百分比不起作用

标签 height width zingchart

每当我以百分比设置 ZingChart 的高度和宽度以使其与所有屏幕尺寸兼容时,它都不起作用。
示例:如果我设置 1% 的高度和 1% 的宽度,则不会发生这种情况。
我将高度和宽度更改为:

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

您可以在此处查看完整代码:
http://jsfiddle.net/xbh2ap18/

最佳答案

ZingChart 的高度和宽度继承自您要附加到的父容器。实际图表是 myChart 的子项,因此您需要将 css 应用于您的容器。

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>

关于height - ZingChart 的高度和宽度百分比不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33162707/

相关文章:

javascript - 如何使用 ZingChart 设置工具提示上的数字格式

android - 如何在设置 `ImageView` 时设置 `layout_weight` 的高度以匹配其宽度?

Android实际自动缩放宽度/高度参数?

jquery - 如何使用CSS正确地并排 float 两列

html - 固定宽度,高度根据父div,父div高度根据屏幕的内容和宽度剩余?

zingchart - 如何在 ZingChart 中为 x 和 y 轴添加标题

ZingChart 如何在单击/选择时修改节点

html - 模拟怪癖模式表格呈现

html - 以百分比设置的对象高度

css - 宽度为 : 100% inside position: absolute on IE7 的表格