2

如何在 ZingChart 中围绕图表和标题栏制作边框。我尝试使用 plotarea 边框,但那是围绕图表而不是完整图表。我想要黑色边框和标题,但我只能制作像这张图片中的红色边框。

在此处输入图像描述

这是代码

 {
"type":"bar",
"plotarea":{
  "border-color" : "#0ff",
  "border-width" : "2px"
},
"series":[
    {
        "values":[11,26,7,44,11]
    },
    {
        "values":[42,13,21,15,33]
    }
]

}

4

1 回答 1

4

可以通过对不同对象的特定使用边框属性来实现这种外观 。在这种情况下,为图表的左右两侧以及标题的底部设置边框。

这是一个示例,展示了这种方法的实际效果,其中的关键部分供您在自己的代码中使用。

var myConfig = {
 	type: "bar",
 	borderRight: "6px solid #000",
 	borderLeft: "6px solid #000",
 	borderBottom: "6px solid #000",
 	title: {
 	  text: "My Title",
 	  height: 40,
 	  borderBottom: "6px solid #000" //needs to be added to title or will be hidden underneath
 	},
	series : [
		{
			values : [35,42,67,89,25,34,67,85]
		}
	]
};
 
zingchart.render({ 
	id : 'myChart', 
	data : myConfig, 
	height: 400, 
	width: 600 
});
<html>
	<head>
		<script src= 'https://cdn.zingchart.com/zingchart.min.js'></script>
		<script> zingchart.MODULESDIR = 'https://cdn.zingchart.com/modules/';
		ZC.LICENSE = ['569d52cefae586f634c54f86dc99e6a9','ee6b7db5b51705a13dc2339db3edaf6d'];</script>
	</head>
	<body>
		<div id='myChart'></div>
	</body>
</html>

我是 ZingChart 团队的一员,所以如果您需要进一步说明或者这不是您想要的,请告诉我。

于 2015-08-07T22:26:56.267 回答