javascript - 单击图例中的项目时如何禁用 ZingChart 中的栏消失

标签 javascript charts zingchart legend-properties

单击该项目时,ZingChart 中图例的默认功能是隐藏与图例中该项目值相关的所有相应条形系列。

我正在执行钻取操作,即从服务器获取图形数据,同时单击图例项,然后用它绘制新图表。现在我不希望这些栏在单击图例项时消失,同时希望在选择图例时执行 onclick 事件。

当我在图例中添加:“toggle-action”:“disabled”时,条形图不会消失,onclick事件也不会消失。

以下是我写的图例项点击函数:

zingchart.bind("hbarChart", "legend_item_click", function (p) {

    var data= p.xdata.band[0];
    getData(data);
}); 

最佳答案

我认为您只需将 toggleAction: disabled 更改为 none

var myConfig = {
 	type: 'bar', 
 	legend: {
 	  toggleAction:'none'
 	},
	series: [
		{
			values: [35,42,67,89]
		},
		{
			values: [25,34,67,85]
		}
	]
};

function legendClickHandler(){
  console.log('test worked!');
}

zingchart.bind('myChart', 'legend_item_click', legendClickHandler );
zingchart.bind('myChart', 'legend_marker_click', legendClickHandler );

zingchart.render({ 
	id: 'myChart', 
	data: myConfig, 
	height: '100%', 
	width: '100%' 
});
html, body {
	height:100%;
	width:100%;
	margin:0;
	padding:0;
}
#myChart {
	height:100%;
	width:100%;
	min-height:150px;
}
<!DOCTYPE html>
<html>
	<head>
	<!--Assets will be injected here on compile. Use the assets button above-->
		<script src= "https://cdn.zingchart.com/zingchart.min.js"></script>
	</head>
	<body>
		<div id="myChart"></div>
	</body>
</html>

关于javascript - 单击图例中的项目时如何禁用 ZingChart 中的栏消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40506769/

相关文章:

javascript - 带超链接和 1 次点击展开/折叠的 Google 组织结构图

javascript - d3js : how to put circles at the end of an arc

javascript - 使用正则表达式获取字符串的第一部分?

javascript - 谷歌图表编号格式

javascript - 理解内存的斐波那契函数

android - 如何在AChartEngine中绘制两个不同比例的Y轴

PHP 图表库

javascript - Zingchart:无法正常工作?引用错误:未定义zingchart

javascript - 如何防止 ZingChart 中的重置超时

zingchart - 值框背景消失了