#javascript #chart.js
#язык JavaScript #chart.js
Вопрос:
Я новичок в программировании и пытаюсь создать пользовательскую легенду для своей диаграммы, как я могу использовать свойство «скрыто», потому что, когда я нажму на нее, она будет обводкой,
когда я делаю «скрыто: верно», все они зачеркиваются, а не только тот, на который я нажал
Ps: Я использую версию 2.9.4 chart.js
Вот мой код
legend: { display: true, labels: { generateLabels: (chart) =gt; chart.data.datasets.map((dataset, i) =gt; ({ datasetIndex: i, text: dataset.label, fillStyle: dataset.backgroundColor, strokeStyle: dataset.borderColor })), fontSize: 10, boxWidth: 10, }, } Ответ №1:
Вы можете использовать isDatasetVisible метод для объекта диаграммы с текущим индексом набора данных, чтобы проверить, скрыт ли он. Это возвращает логическое значение, так что вы можете поместить его туда сразу же после его инверсии.
var options = { type: 'line', data: { labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"], datasets: [{ label: '# of Votes', data: [12, 19, 3, 5, 2, 3], borderWidth: 1 }, { label: '# of Points', data: [7, 11, 5, 8, 3, 7], borderWidth: 1 } ] }, options: { legend: { labels: { generateLabels: (chart) =gt; chart.data.datasets.map((dataset, i) =gt; ({ datasetIndex: i, text: dataset.label, fillStyle: dataset.backgroundColor, strokeStyle: dataset.borderColor, hidden: !chart.isDatasetVisible(i), })), } } } } var ctx = document.getElementById('chartJSContainer').getContext('2d'); new Chart(ctx, options); lt;bodygt; lt;canvas id="chartJSContainer" width="600" height="400"gt;lt;/canvasgt; lt;script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"gt;lt;/scriptgt; lt;/bodygt;