php - 如何在 ZingChart 中为容器制作边框

标签 php html css charts zingchart

如何在 ZingChart 中在图表周围制作边框并在其上方制作标题栏。我尝试使用绘图区域边框,但那是在图表周围而不是完整的图表。我想要黑色边框和标题,但我只能制作如图所示的红色边框。

enter image description here

这是代码

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

}

最佳答案

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

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

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 团队的成员,因此如果您需要更多说明或者这不是您想要的内容,请告诉我。

关于php - 如何在 ZingChart 中为容器制作边框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31886944/

相关文章:

javascript - 如何构建自定义 ng-view 指令,可能使用 ng-includes?

html - 添加自动幻灯片已创建水平滚动?

css - 复选框顶部居中标签

PHP内置数组函数

javascript - 使用 jsPDF 从远程 URL 创建 PDF 文件

html - 将视频置于 DIV 中

css - DIV、DOJO、垂直滚动和 IE6

html - 标题中的电话号码不可点击

php - 等待 AJAX 请求,然后完成 jQuery

javascript - 一键下载多个 pdf 文件 zip