所以我正在开发一个代码已经存在的项目。
在下面的 2 个文件中,我需要在 IF 语句中以某种方式将颜色设置从第一个文件删除到第二个文件。
原因是第一个文件将填充/注入(inject)来自后端的信息,但为了做到这一点,我必须从数据集中删除属性(标签、填充颜色、描边颜色、点颜色、点描边颜色、点突出填充和点突出描边)数组文件 1 到文件 2,以便将样式与将注入(inject)的实际数据分开
我尝试简单地将数据集部分添加到第二个文件中,但没有显示任何内容 - 可以以某种方式将其添加到 Chart.types.Line.extend 对象或 AJAX 部分吗?
提前非常感谢
文件 1:(将向其注入(inject)数据):
{
"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",
});
}
最佳答案
所以这是我所得到的:
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",
});
}
我正在尝试添加一个数据集数组,然后将其添加到数据集数组中第一个文件的数组中。不走运,但我认为上面这个答案中我的代码在语法上是错误的
关于javascript - 如何将 Google 图表颜色设置从文件移动到另一个文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39222250/