使用 angular-chart 时,我可以用函数定义数据点颜色吗?
Can I define data point color with a function when using angular-chart?
https://github.com/GraFiddle/angular-chart
在 C3 库中有一个数据相关颜色的示例 (http://c3js.org/samples/data_color.html):
var chart = c3.generate({
data: {
...,
color: function (color, d) {
// d will be 'id' when called for legends
return d.id && d.id === 'data3' ? d3.rgb(color).darker(d.value / 150) : color;
}
}
});
所以我想添加一个 color
函数:
dims = {
dt: {
axis: 'x',
name: 'Date',
displayFormat: '%H:%M:%S',
dataType: 'datetime'
}
};
// key is something like errorRate etc.
dims[key] = {
axis: 'y',
name: key,
type: 'line',
color: function(color, d) {
return console.log(arguments);
}
};
但是颜色函数似乎被忽略了。有没有办法用这个库制作依赖于功能的颜色?
看起来它只是一个字符串,可以分叉它来支持它并提交 PR:
回复:https://github.com/GraFiddle/angular-chart/blob/master/src/js/converter.js
// set color
if (angular.isString(dimension.color)) {
configuration.data.colors[key] = dimension.color;
}
我确实设法让它与 angular-图表一起工作:
# coffeescript
graphOptions =
data: datapoints
dimensions: dims
chart:
data:
color: (color, d) ->
if d.index? and data[d.index]?
return colors[data[d.index].status]
else return color
此函数将根据数据点 status
字段中的值从颜色散列中 return 值。
https://github.com/GraFiddle/angular-chart
在 C3 库中有一个数据相关颜色的示例 (http://c3js.org/samples/data_color.html):
var chart = c3.generate({
data: {
...,
color: function (color, d) {
// d will be 'id' when called for legends
return d.id && d.id === 'data3' ? d3.rgb(color).darker(d.value / 150) : color;
}
}
});
所以我想添加一个 color
函数:
dims = {
dt: {
axis: 'x',
name: 'Date',
displayFormat: '%H:%M:%S',
dataType: 'datetime'
}
};
// key is something like errorRate etc.
dims[key] = {
axis: 'y',
name: key,
type: 'line',
color: function(color, d) {
return console.log(arguments);
}
};
但是颜色函数似乎被忽略了。有没有办法用这个库制作依赖于功能的颜色?
看起来它只是一个字符串,可以分叉它来支持它并提交 PR:
回复:https://github.com/GraFiddle/angular-chart/blob/master/src/js/converter.js
// set color
if (angular.isString(dimension.color)) {
configuration.data.colors[key] = dimension.color;
}
我确实设法让它与 angular-图表一起工作:
# coffeescript
graphOptions =
data: datapoints
dimensions: dims
chart:
data:
color: (color, d) ->
if d.index? and data[d.index]?
return colors[data[d.index].status]
else return color
此函数将根据数据点 status
字段中的值从颜色散列中 return 值。