Cubism.js - 範圍到顏色映射

我使用cubism.js來生成CPU利用率時間序列。我有這個系列顯示，但是我注意到顏色如何賦值給一些奇怪的東西。Cubism.js - 範圍到顏色映射

例如，值10獲得與值100（紅色）相同的顏色。我已經定義了50種以下的顏色。我期望每5個值（大於0）將被分配給相應的顏色。

我會期望值10獲得顏色＃00DDDD和值100獲得顏色＃FF0000。

從比例範圍到顏色定義的映射在哪裏？

這是我正在談論的代碼部分的代碼片段。

var colors = ["#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", "#ffffff", 
"#00BBBB", "#00CCCC", "#00DDDD", "#00EEEE", "#00FFFF", "#00BB5E", "#00CC66", "#00DD6F", "#00EE77", "#00FF84", "#BBBB00", "#CCCC00", "#DDDD00", "#EEEE00", "#FFFF00J", "#BB5E00", "#CC6600m", "#DD6F00", "#EE7700", "#FF8000", "#BB0000", "#CC0000", "#DD0000", "#EE0000", "#FF0000"]; 

// Iterate through each search criteria, passing the host, criteria tuple. 
// Queries and returns app server metrics, finally graphing accordingly. 

var scale = d3.scale.linear().range([0,100]); 
d3.select("body").selectAll(".horizon") 
    .data(search_criterias.map(app_server_data_collector)) 
    .enter().insert("div", ".bottom") 
    .attr("class", "horizon") 
    .call(context.horizon().scale(scale).colors(colors).format(d3.format("+,")));

來源

2012-10-12 toaler

這個問題類似：Color bands for cubism.js

立體主義使用extent選項來設置最小和地平線圖表的最大值，規模不在該範圍。如果您沒有明確設置範圍，則只會在數據中使用最小值和最大值，這可能無法爲您提供所需的色帶。相反，請確保您添加horizon.extent([0, 100])而不是比例範圍。

此外，它看起來像你打算所有的數據是積極的。請記住，水平圖將顏色的前半部分指定爲負值，將後半部分指定爲正值。如果只有正值，則顏色數組的前半部分將被忽略。

來源

2013-01-07 17:19:19 Aaron

Cubism.js - 範圍到顏色映射

回答

相關問題