我想自定义我的柱形图 API 如下
1)当我单击图例时,与之关联的数据集应返回 null 并以禁用颜色显示图例。我的代码如下。
function drawVisualization() {
// Create and populate the data table.
var chart_div = document.getElementById('visualization2');
var data2 = google.visualization.arrayToDataTable([["Sections","Client Scored",{ role: "style" },"Client Confidence",{ role: "style" },"Average Mark",{ role: "style" },"Average Confidence",{ role: "style" }],["Set 1",90,"opacity: 1",95,"opacity: 0.5",78,"opacity: 1",69,"opacity: 0.5"],["Set 2",65,"opacity: 1",73,"opacity: 0.5",99,"opacity: 1",99,"opacity: 0.5"]]);
var options = {
title:"Understanding",
width:'100%', height:600,seriesType: "bars"
,series:{1: {type: "line",pointSize: 10,lineWidth :0},3: {type: "line",pointSize: 10,lineWidth :0}}
,colors: ['#fafe14','#fafe14','#05afed','#05afed']
,vAxis: {title: "%Score",format: '##', minValue: '1', maxValue: '8'},
hAxis: {title: "",slantedText: true,slantedTextAngle:60, maxTextLines: 5, maxAlternation: 10 },
chartArea: {height: '60%',top:10}
};
var chart = new google.visualization.ColumnChart(chart_div);
chart.draw(data2, options);
}
为此,我尝试了hideColumns功能并且它有效,但问题是图例也会随着数据集淡出,如果我删除第二列,第三列将变为第二列,4 将变为 3,5 将变为 4。
2)我的第二个问题是第 1 列和第 3 列是线宽为零的行,如下所示。