2017-05-03 13 views
1

Chart.jsに水平グループ化棒グラフを作成しましたが、奇妙な問題に悩まされています。 問題は、すべてのグリッド線と境界線を無効にしている間に、グラフには、私が取り除きたい水平線の上端が表示されていることです。 このスクリーンショットには、http://imgur.com/41YGxA8が表示されています。 は、私はまた、JSFiddleを作った:https://jsfiddle.net/bsocw1v9/水平棒グラフ(Chart.js 2)の上部水平線を削除します。

function create_horizontal_bar_chart(){ 
/** 
* Draw the chart on the correct canvas. Add the correct data sets 
* and set the correct draw type. 
*/ 
let ctx = document.getElementById('monthly_subscription_revenue_chart').getContext("2d"); 
let data = { 
labels: ['Diensten'], 
datasets: [ 
    { 
     type: 'horizontalBar', 
     backgroundColor: "rgb(0,33,86)", 
     data: [2250], 
     stack: 1 
    }, 
    { 
     type: 'horizontalBar', 
     backgroundColor: "rgb(219,219,219)", 
     data: [3000], 
     stack: 2 
    }, 
    { 
     type: 'horizontalBar', 
     backgroundColor: "rgb(240,95,0)", 
     data: [750], 
     stack: 3 
    }, 
] 
}; 
new Chart(ctx, { 
    type: 'horizontalBar', 
    data: data, 
    showScale: false, 
    options: { 
     legend: { 
      display: false 
     }, 
     tooltips: { 
      enabled: false 
     }, 
     hover: { 
      mode: null 
     }, 
     scales: { 
      xAxes: [{ 
       stacked: true, 
       display: false, 
       gridLines: { 
        drawBorder: false, 
       }, 
      }], 
      yAxes: [{ 
       stacked: true, 
       barPercentage: 0.9, 
       gridLines: { 
        drawBorder: false, 
       }, 
      }] 
     } 
    } 
}); 

}

私はこれを引き起こしていただきました!私は単純に把握することはできませんとして、誰かがこの問題で私を助けることができる願っています。

答えて

0

グリッド線ではなく、(drawBorderfalseに設定して)グラフの端に境界線を無効にしました。バグのある行はグリッド線です。軸用にグリッドラインを無効にするには:

gridLines: { 
    display: false 
} 

は、「グリッド線の設定」の下にdocsを見てください。

+0

今私はこのような問題を手伝ってくれてありがとう。 – viewtYy

関連する問題