2016-05-17 7 views
0

データセット/ラベルに1つのプロパティを追加して、クリック時にそのプロパティを識別する必要があります。 私はこのような何か試してみた:グラフの背景が見えるが、空である、私は、データセットからのデータを全く意味しない、私は新しいプロパティ「コード」を見ることができるので、データがそれに関連付けられている、chart.js 2.0新しいプロパティをデータセットに追加

Chart.controllers.customBar = Chart.controllers.bar.extend({ 
     code: null 
    }); 

をし、それはほとんど動作します可視。

これは私の初期化です:

var ctx = document.getElementById("roads-chart").getContext("2d"); 
    window.roadsBar = new Chart(ctx, { 
     type: 'bar', 
     data: roadsChartData, 
     options: { 
      title: { 
       display: true, 
       text: "Stan dróg" 
      }, 
      tooltips: { 
       mode: 'label' 
      }, 
      responsive: true, 
      scales: { 
       xAxes: [{ 
         stacked: true, 
        }], 
       yAxes: [{ 
         stacked: true 
        }] 
      }, 
      onClick: function(e, d) { 
       console.log(d); 
      } 
     } 
    }); 

事があり、私は誰かが私はそれを扱う助け、仕事を延長しない方法の例を示すことができ、Chart.jsを感じませんか? :)

おかげ

答えて

0

あなたは内部プロパティ(つまりはおそらくchart.jsのそれ以降のバージョンで変更される可能性)に依存する気にしない場合は、これを行うには、チャートを拡張することもできますが、あなただけ使用することができますそう

options: { 
    onClick: function(e, d) { 
     if (d.length > 0) { 
     console.log(this.config.data.datasets[d[0]._datasetIndex].code[d[0]._index]); 
     } 
    } 
    ... 

... 
    datasets: [{ 
    code: ['a', 'b', 'c', 'd', 'e', 'f', 'g'], 
    ... 
のように、チャートの設定から、あなたの余分なプロパティを取得するために _datasetIndex_indexプロパティ210

フィドル - http://jsfiddle.net/55cdvb20/

関連する問題