chart.jsの軸線の削除

Question

私はいくつかのChart.jsで作業しており、グラフ上の軸線を削除する方法を解明しようとしています。

You can see the grid lines I am trying to remove in this image.

私は、データが表現され、チャート内に表示されるグリッド線を削除するために管理しているが、私はこれらの2行を削除し、問題が生じています。

私は下のチャートのために作成したchart.jsを見ることができます。

var ctx = document.getElementById("volCause").getContext('2d'); 
var volCause_Doughnut = new Chart(ctx, { 
    type: 'horizontalBar', 
    data: { 
      labels: <?php echo $cause_label_json?>, 
     datasets: [{ 
      backgroundColor: benefactoGraph_colours, 
      data: <?php echo $cause_value_json?> 

     }] 
    }, 

    options: { 
     maintainAspectRatio: false, 
     legend: { 
      display: false, 
     }, 
     scales: { 
      xAxes: [{ 
       scaleLabel: { 
        display: true, 
        labelString: 'Volunteer Hours', 
       }, 
       gridLines: { 
        display: false, 
       }, 
      }], 

      yAxes: [{ 
       gridLines: { 
        display: false, 

       } 
      }] 

     } 

    } 
}); 

どのような提案も大歓迎です。

Answer 1

あなたはそうのように、これらの軸の行を削除するために、falseにグリッドラインのdrawBorderプロパティを設定する必要があります。

... 
scales: { 
    xAxes: [{ 
     scaleLabel: { 
     display: true, 
     labelString: 'Volunteer Hours', 
     }, 
     gridLines: { 
     display: false, 
     drawBorder: false //<- set this 
     }, 
    }], 
    yAxes: [{ 
     gridLines: { 
     display: false, 
     drawBorder: false //<- set this 
     } 
    }] 
} 
... 

Answer 2

あなたが表示を設定することができます：あなたの軸オブジェクトに虚偽を

scales: { 
    xAxes: [{ 
    display: false, 
    gridLines: {} 
    }], 
    yAxes: [{ 
    display: false, 
    gridLines: {} 
    }] 
}