三.js每簇线条的新颜色



我有大约1000行。我将在收到用户输入他想要多少个集群后将它们作为集群。我想为每个集群赋予新的颜色。我不想为这 1000 行中的每一行手动指定颜色。

示例代码:

var material = new THREE.LineBasicMaterial({ color: new THREE.Color("rgb(0, 102, 153)" // color: chroma.limits(data, 'e', 1)) });

我想在 for 循环中为每个集群中的每行创建材料时自动选择新的不同 rgb 颜色。

我有一个使用 d3.js scalecategory 的解决方案。但这仅限于 10 或 20 种颜色,

我也尝试使用色度.js如上评论行所示。但没用,

编辑1:将问题更改为行簇,而不是每个不同的行。

你可以从这个答案中借用一个函数,然后就很容易了:

var usedColors = [];
function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
function getNewColor() {
    var color;
    while(!color || usedColors.indexOf(color) !== false) {
        color = 'rgb(' + getRandomInt(0, 255) + ', ' + getRandomInt(0, 255) + ', ' + getRandomInt(0, 255) + ')';
    }
    usedColors.push(color);
    return color;
}
var newColor = new THREE.Color(getNewColor());
var material = new THREE.LineBasicMaterial({ color: newColor });

这保证了您每次都能获得新的颜色。请注意,对于很多颜色,这个过程会越来越慢,直到你最终进入无限循环。不过,有一千种颜色,你应该是安全的。

最新更新