Chart.js：图表类型的动态更改（以线到条为例）

我正在尝试根据选择框更改热交换图表类型。如果数据需要更新，则会发生更改

例如，在页面加载时，我创建了如下图表：

var config = {
     type: 'line',
     data: {
        labels: this.labels,
        datasets: [{
            label: 'Some Label',
            data: this.values
        }]
     },
     options: {
         responsive: true
     }
}
var context = document.getElementById('canvas').getContext('2d');
window.mychart = new Chart(context, config);

然后我将组合框更改为条形图。我已经在页面加载上用条形图测试了数据，效果很好

以下是我试图改变图表的方式

window.mychart.destroy();

// chartType = 'bar'
config.type = chartType;

var context = document.getElementById('canvas').getContext('2d');
window.mychart = new Chart(context, config);

window.mychart.update();
window.mychart.render();

但什么也没发生。折线图仍然存在。如何动态更改图表类型？（即使这意味着销毁并重新创建图表画布）

更新

---

注意，它看起来像是在破坏图表，但一直在重新绘制折线图，即使我做了

console.log（config.type）并返回
条
，而不是
行
替代解决方案可以非常简单，只需在单独的Div元素中创建两个图表。然后根据您的条件，只需在javascript中显示一个，隐藏另一个。这应该可以用于更改图表类型以满足您的需求。
修复程序

销毁旧图表（以删除事件侦听器并清除画布）
制作配置对象的深度副本
更改副本的类型
传递副本而不是原始对象


示例概述：

var temp = jQuery.extend(true, {}, config);
temp.type = 'bar'; // The new chart type
myChart = new Chart(ctx, temp);

注意：使用Chart.js的2.0.1版

为什么会这样
Chart.js修改传入的配置对象。因此，您不能只更改“config.type”。您可以进入修改后的对象并将所有内容更改为所需的类型，但只保存原始配置对象要容易得多。
接下来，这一点在v.2.1.3中已得到修复，如下所示：

在最新版本中已确认修复。签出并按下图表下方的按钮，将其从条形图更改为折线图
 在ChartJS中，图表类型也可以像图表数据一样轻松更改。下面的例子可能会有所帮助

        my_chart.type = 'bar';
        my_chart.update();

我正在尝试一种“图表生成器”。选择图表类型，然后选择数据源，依此类推。因此，本质上我只希望页面上有一种图表类型，并希望在必要时将它们进行交换。我能想到的一个解决方案是使用不同的Div模板，为不同的图表类型使用不同的元素。然后在要显示图表的区域中，有一个主父Div元素。根据图表类型的选择，可以添加/删除与所选图表类型对应的子Div元素。我相信这样你也会有更好的表现。谢谢你。我发现这是2.0中的一个意外错误，将在下一个版本中修复。但是您的深度复制解决方案在短期内有效。这是可行的，但是如果我们只传递一个我们想要呈现的图表类型而不是数据部分，那就太好了。我无法使此方法起作用。更新其他参数有效，而更新类型无效。
        my_chart.type = 'bar';
        my_chart.update();