Question

所以我正在开发一个代码已经存在的项目。

在下面的2个文件中，我需要在IF语句中以某种方式从第一个文件中删除颜色设置到第二个文件。

原因是第一个文件将从后端填充/注入信息，但为了这样做，我必须从数据集中删除propeties（label，fillColor，strokeColor，pointColor，pointStrokeColor，pointHighlightFill和pointHighlightStroke）数组文件1到文件2，以便从将要注入的实际数据中分离样式

我尝试过简单地将数据集部分添加到第二个文件但是没有显示任何内容 - 它可以以某种方式添加到Chart.types.Line.extend对象或AJAX部分吗？

非常感谢提前

文件1 :(将数据注入其中）：

{  
  "labels":[  
     "1 Feb",      
     "8 Feb",      
     "15 Feb",      
     "22 Feb",      
     "29 Feb",      
     "7 Mar",      
     "14 Mar",      
     "21 Mar",      
     "28 Mar",      
     "4 Apr",      
     "11 Apr",      
     "18 Apr",      
     "25 Apr"
  ],
  "datasets":[  
     {  
        "label":"Tenders",
        "fillColor":"rgba(253,0,20,0.2)",
        "strokeColor":"rgba(253,0,20,1)",
        "pointColor":"#fff",
        "pointStrokeColor":"rgba(253,0,20,1)",
        "pointHighlightFill":"#fff",
        "pointHighlightStroke":"rgba(253,0,20,1)",
        "data":[  
        77,
        55,
        40,
        65,
        59,
        80,
        81,
        56,
        55,
        65,
        59,
        80,
        75            
        ]
     }
  ]
}

文件2 :(我想要数据集属性）：

if (document.getElementById("chart_div_won")) {

    Chart.types.Line.extend({
        name: "LineAlt",
        initialize: function(data) {
            Chart.types.Line.prototype.initialize.apply(this, arguments);
            var xLabels = this.scale.xLabels;
            var xLabelsLength = xLabels.length;
            xLabels.forEach(function(label, i) {
                if (i % 4 != 0 || i <= 1 || i == xLabelsLength - 1)
                    xLabels[i] = '';
            })
        }
    });

    var form_data = {};
    $.ajax({
        type: "GET",
        url: "../../../sample_data/chart1.json",
        data: form_data,
        success: function(response) {
            var ctx = document.getElementById("chart_div_won").getContext("2d");
            var options = {
                responsive: true,
                maintainAspectRatio: true,
                pointDotRadius: 5,
                showXLabels: 5,
            };
            var myLineChart = new Chart(ctx).LineAlt(response, options);

        },
        error: function() {
            $('div#chart-container').html('<div class="notification-body"><p class="notification-heading">Loading error...</p><p class="notification-description">Unfortunatley for some reason visual data failed to load.</p></div>'); 
        },
        dataType: "json",
        contentType: "application/json; charset=utf-8",
    });
}

Answer 1

所以我这就是我所拥有的：

if (document.getElementById("chart_div_won")) {


    Chart.types.Line.extend({
        name: "LineAlt",
        initialize: function(data) {
            Chart.types.Line.prototype.initialize.apply(this, arguments);
            var xLabels = this.scale.xLabels;
            var xLabelsLength = xLabels.length;
            xLabels.forEach(function(label, i) {
                if (i % 4 != 0 || i <= 1 || i == xLabelsLength - 1)
                    xLabels[i] = '';
            })
        }
    });

    var datasets = [{
                        "label":"Tenders",
                         "fillColor":"rgba(253,0,20,0.2)",
                         "strokeColor":"rgba(253,0,20,1)",
                         "pointColor":"#fff",
                         "pointStrokeColor":"rgba(253,0,20,1)",
                         "pointHighlightFill":"#fff",
                         "pointHighlightStroke":"rgba(253,0,20,1)"}
        ];
    var form_data = {};

    $.ajax({
        type: "GET",
        url: "../../../sample_data/chart1.json",
        data: form_data.push(datasets),

        success: function(response) {
            var ctx = document.getElementById("chart_div_won").getContext("2d");
            var options = {
                responsive: true,
                maintainAspectRatio: true,
                pointDotRadius: 5,                                                  
                showXLabels: 5,
            };
            var myLineChart = new Chart(ctx).LineAlt(response, options);

        },
        error: function() {
            $('div#chart-container').html('<div class="notification-body"><p class="notification-heading">Loading error...</p><p class="notification-description">Unfortunatley for some reason visual data failed to load.</p></div>'); 
        },
        data: form_data.push(datasets),
        dataType: "json",
        contentType: "application/json; charset=utf-8",
    });
}

我正在尝试添加数据集数组，然后将其添加到数据集数组中第一个文件中的数组中。没有运气，但我认为我的代码在上面的答案中语法错误

Answer 2

对于有这个或类似问题的人。最后这很容易。我所要做的就是在数组的末尾添加每个属性。

代码

myLineChart.datasets[0].fillColor = "rgba(253,0,20,0.2)";

等等

如何将Google Charts颜色设置从文件移动到另一个

2 个答案: