我有一個二維陣列,坐標為第三列,也就是字串類目,然后想不同類目的資料通過不同顏色表示區分。
var temp = new Array();
// 指定圖表的配置項和資料
temp = [ [ 1, 7,'a' ],
[ 2, 8 ,'a'],
[ 3, 9 ,'a'],
[ 4, 10 ,'a'],
[ 5, 8 ,'b'],
[ 6, 7,'b' ],
[ 7, 10,'b' ],
[ 8, 9,'c' ],
[ 9, 9,'c' ],
[ 10, 10,'a' ],
[ 11, 9,'a' ],
[ 12, 7,'b' ],
[ 13, 9,'b' ],
[ 14, 10,'b' ],
[ 15, 10,'c' ],
[ 16, 9,'c' ],
[ 17, 8 ,'b'],
[ 18, 7 ,'c'],
[ 19, 7 ,'a'],
[ 20, 8 ,'c'],
[ 21, 9 ,'c'],
];
var topline = 0;
var bottonline = 0;
//獲取數值
var x2 = [];
for (var j = 0; j < temp.length; j++) {
x2[j] = temp[j][1];
} //獲取第二列,根據temp中對應的陣列進行調整
var x3 = [];
for (var j = 0; j < temp.length; j++) {
x3[j] = temp[j][2];
} //獲取第三列,
var compare = function (x, y) {//比較函式
if (x < y) {
return -1;
} else if (x > y) {
return 1;
} else {
return 0;
}
}
x3.sort(compare);//對X3進行了排序
option = {
xAxis: {
data:x3
},
yAxis: {},
series: [{
symbolSize: 20,
data:x2,
type: 'scatter',
itemStyle : {
normal : {
color:function(params){
// var colorList = ['rgb(164,205,238)','rgb(42,170,227)','rgb(25,46,94)','rgb(195,229,235)'];
// return colorList[params.dataIndex];
// 借用了柱狀圖的不同類目采用不同顏色進行回圈使用,但不起作用。前四個分別使用了上述4種顏色,但后面都是用的第四種顏色
}
}
},
}]
};

最初的想法是用for回圈,去判斷陣列字串和前面一個對比是否一樣(所以先給排序了),如果不一樣,就換顏色,
存在兩個問題:
1.for回圈里面陳述句怎么寫改變X3[i+1]的color顏色
2.因為對字串數未知,可否隨機顯示顏色或者回圈使用。
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/112633.html
標籤:HTML(CSS)
下一篇:想做一個點擊之后可以最小化的
