Question

我试图在我的网站上使用chart.js。但是我在更新它时遇到了一些问题。

HTML：

  <a href="#" class="date-select" data-chart="dishesChart" data-period="day">day</a>
  <a href="#" class="date-select" data-chart="dishesChart" data-period="week">week</a>
  <a href="#" class="date-select" data-chart="dishesChart" data-period="month">month</a>

  <canvas id="dishesChart" style="width: 100%;"></canvas>

JS：

var dishesChartCanvas = document.getElementById("dishesChart");

var dayDataset = {
   datasets: [{
     data: [1, 2, 3, 4, 5]
   }],

   labels: [
     some data array
   ]
};

// here comes same variables for week and month datasets


var dishesChart = new Chart(dishesChartCanvas, {
  type: 'pie',
  data: dayDataset, // default
  options: dishesChartOptions
});

问题是：这段代码正在运行：

$('.date-select').on('click', function(e) {
  e.preventDefault();
  dishesChart.data.datasets[0].data = monthDataset.datasets[0].data;
  dishesChart.data.labels = monthDataset.labels;
  dishesChart.update();
});

但是这段代码给出了 Uncaught TypeError：无法读取属性

$('.date-select').on('click', function(e) {
  e.preventDefault();
  var chartname = $(this).data("chart");
  var period = $(this).data("period") + "Dataset";
  chartname.data.datasets[0].data = period.datasets[0].data;
  chartname.data.labels = period.labels;
  chartname.update();
});

我是JS和jQuery的新手，所以让我知道我做错了什么。

谢谢！

UPD：已修复

默认情况下，data-attribute是string，要将其转换为对象，您应该添加window [var_name]：

问题：

var chartname = $(this).data("chart");

溶液：

var chartname = window[$(this).data("chart")];

Answer 1

var chartname = window[$(this).data("chart")];

chart.js 2.7.1 |使用变量更新图表

UPD：已修复

1 个答案: