7

以下のように縦棒グラフ 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機能を試してみましたが、うまくいきましたが、問題は凡例もデータセットと共にフェードアウトし、2 番目の列を削除すると 3 番目の列が 2 番目になり、4 が 3 になり、5 が 4 になることです。

2) 私の 2 番目の質問は、以下に示すように、列 1 と列 3 が線幅ゼロの線です。

ここに画像の説明を入力

以下に示すように、これを最初のバーのちょうど真ん中に移動する方法はありますか? ここに画像の説明を入力

4

1 に答える 1