第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

如何從工具提示訪問特定數(shù)據(jù)值-Chart.js

如何從工具提示訪問特定數(shù)據(jù)值-Chart.js

一只萌萌小番薯 2021-04-17 22:19:18
我正在嘗試將對象數(shù)組作為數(shù)據(jù)傳遞到圖形數(shù)據(jù),包括x的值和每個(gè)工具提示中將使用的其他一些值。在我的數(shù)據(jù)數(shù)組中,每個(gè)對象都包含x和的value值。我想在value內(nèi)部訪問它tooltips,最后在鼠標(biāo)懸停在每個(gè)圖形數(shù)據(jù)上時(shí)顯示的工具提示中顯示值。這是我的代碼:var myChart = new Chart(ctx, {  type: 'line',  data: {    labels: ['2017/06/12', '2017/06/23', '2017/07/12', '2017/07/23', '2017/08/12', '2017/08/23', '2017/09/12'],    datasets: [{      label: 'Values',      data: [{          y: 12,          value: 12        },        {          y: 3,          value: 13        },        {          y: 1,          value: 15        },        {          y: -3,          value: 5        },        {          y: 67,          value: 18        },        {          y: 12,          value: 11        },        {          y: 13,          value: 19        }      ],      fill: false,      backgroundColor: [        'rgba(255, 99, 132, 0.2)',        'rgba(54, 162, 235, 0.2)',        'rgba(255, 206, 86, 0.2)',        'rgba(75, 192, 192, 0.2)',        'rgba(153, 102, 255, 0.2)',        'rgba(255, 159, 64, 0.2)'      ],      borderColor: [        'rgba(255, 99, 132, 1)',        'rgba(54, 162, 235, 1)',        'rgba(255, 206, 86, 1)',        'rgba(75, 192, 192, 1)',        'rgba(153, 102, 255, 1)',        'rgba(255, 159, 64, 1)'      ],      borderWidth: 2    }]  },  options: {    tooltips: {      // HERE I WANT TO ACCESS VALUE VARIABLE AND DISPLAY IT IN TOOLTIP    },    responsive: true,    maintainAspectRatio: false,    scales: {      yAxes: [{        ticks: {          beginAtZero: true        }      }]    }  }});
查看完整描述

1 回答

?
大話西游666

TA貢獻(xiàn)1817條經(jīng)驗(yàn) 獲得超14個(gè)贊

Chart.js工具提示文檔的“標(biāo)簽回調(diào)”部分包含一個(gè)部分,該部分顯示了如何指定給定數(shù)據(jù)點(diǎn)顯示的文本。您需要編寫一個(gè)帶有以下參數(shù)的函數(shù):


tooltips: {

  callbacks: {

    label: function(tooltipItem, data) {

      return '...';

    }

  }

}

對于部分工具提示項(xiàng)界面顯示您傳遞給通過回調(diào)什么樣的信息tooltipItem。這里重要的是datasetIndex((項(xiàng)目來源的數(shù)據(jù)集的index索引)和(該數(shù)據(jù)項(xiàng)目在數(shù)據(jù)集中的索引)。使用這些,您可以在中訪問正確的項(xiàng)目data。


將其放在一起是一個(gè)非常簡單的示例訪問,y并value在工具提示中


小提琴(刪除backgroundColor/,borderColor因?yàn)樗鼘?dǎo)致錯誤):


tooltips: {

  callbacks: {

    label: function(tooltipItem, data) {

      var item = data.datasets[tooltipItem.datasetIndex].data[tooltipItem.index];

      return item.y  + ' ' + item.value;

    }

  }

}


查看完整回答
反對 回復(fù) 2021-04-29
  • 1 回答
  • 0 關(guān)注
  • 157 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號