如何提取ChartJS数据和配置属性

Question

我们试图使同事能够彼此共享 CHATSJS 图形。我们当前的大多数图表都是动态的，用户可以应用过滤器(日期，添加/删除数据等(。该计划是具有一个按钮，在单击上，将获取 data 和属性(标签，线颜色，borderwidth，Chartwidth，Chart类型等((并通过URL传递此数据。然后，用户可以将该链接发送到其他人。他们可以打开它，以查看原始用户所看到的捕获的图表，就像屏幕截图一样，但是启用了所有交互式功能。

例如。

stackoverflow.com/shared_chart.php?conf={"Responsive":true，20022 Responsivea

当myChart = new Chart(ctx, config); Chartjs创建图表时，我不需要的图表对象(例如$ plugin，_Meta(添加了许多新属性。而且，当我 JSON.stringify(myChart.config)时，我会收到一个错误

" usfult typeError：将圆形结构转换为json" 

。

我添加了下面创建示例栏图所需的代码：

// HTML needs a canvas element
<-- <canvas id="myChart"></canvas> -->
const ctx = $('#myChart');
let config;
let myChart;

// config would look something like this
config = {
    type: 'bar',
    data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
        datasets: [{
            label: 'Dataset 1',
            backgroundColor: 'rgba(92,184,92,0.5)',
            borderColor: 'rgba(92,184,92,1.000)',
            borderWidth: 2,
            data: [
                1,2,3,4,3,2,1
            ]
        }, {
            label: 'Dataset 2',
            backgroundColor: 'rgba(66,139,202,0.5)',
            borderColor: 'rgba(66,139,202,1)',
            borderWidth: 2,
            data: [
                7,2,3,1,5,2,1
            ]
        }]
    },
    options: {
        responsive: true,
        maintainAspectRatio: false,
        legend: {
            position: 'top',
        },
        title: {
            display: true,
            text: 'Chart.js Bar Chart'
        }
    }
}    
myChart = new Chart(ctx,config);

在他们被定向的页面上，我想抓住获取数据并构建一个新图表。

Answer 1

您可以排除图表添加的额外属性。例如：

JSON.stringify(myChart.config, function(key, value) {
    if (key === '_meta') return undefined;
    else return value;
}