对散点图使用固定颜色集
Use a fixed color set for scatter chart plots
我有一个随机颜色函数,它为散点图中的每个图生成不同的颜色。
function getRandomColor() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
但是我怎样才能为绘图设置固定的颜色?
答案更新:
var colors = ['red','green','blue','#2A0A0A','#00FF40','#8A4B08',"#610B21","#0A2229","#5E610B","#3B0B2E","#FF0040","#B43104","#0B6121","#01DFA5","#2E2EFE","#DF01A5","#088A4B","#B40431","#1C1C1C","#B45F04"];
type: 'scatter',
color: function (color, d) {
return colors[d.index];
},
根据the documentation,颜色函数可以接收两个参数,第一个是基色(目前还不确定这是从哪里来的),以及一个保存点数据的对象(包括指数)。您可以使用此信息从十六进制颜色字符串数组中确定您想要的颜色。
示例:
var colors = ['#1f77b4','#aec7e8','#ff7f0e','#ffbb78'];
...
c3.generate({
data: {
color:function(color, data){
return colors[data.index%colors.length];
//Example way of picking out your colors from a fixed array
},
...}
我有一个随机颜色函数,它为散点图中的每个图生成不同的颜色。
function getRandomColor() {
var letters = '0123456789ABCDEF'.split('');
var color = '#';
for (var i = 0; i < 6; i++) {
color += letters[Math.floor(Math.random() * 16)];
}
return color;
}
但是我怎样才能为绘图设置固定的颜色?
答案更新:
var colors = ['red','green','blue','#2A0A0A','#00FF40','#8A4B08',"#610B21","#0A2229","#5E610B","#3B0B2E","#FF0040","#B43104","#0B6121","#01DFA5","#2E2EFE","#DF01A5","#088A4B","#B40431","#1C1C1C","#B45F04"];
type: 'scatter',
color: function (color, d) {
return colors[d.index];
},
根据the documentation,颜色函数可以接收两个参数,第一个是基色(目前还不确定这是从哪里来的),以及一个保存点数据的对象(包括指数)。您可以使用此信息从十六进制颜色字符串数组中确定您想要的颜色。
示例:
var colors = ['#1f77b4','#aec7e8','#ff7f0e','#ffbb78'];
...
c3.generate({
data: {
color:function(color, data){
return colors[data.index%colors.length];
//Example way of picking out your colors from a fixed array
},
...}