Javascript生成隨機顏色，具有同等亮點

Question

我正在使用charts.js庫，我需要爲圖表單元生成隨機顏色。

我看到了很多關於如何這樣做的答案。例如Anatoliy answer。

事情是，我需要它等價的高亮顏色以及（或任何接近的顏色）來實現charts.js Pie的'highlight'字段。

{ 
    value: 300, 
    color: "#30a5ff", 
    highlight: "#62b9fb", 
    label: "Label" 
}, 

Answer 1

這是許多可能的解決方案之一。獲得0到360之間的隨機色調。對於「高光」顏色，對於主色使用100％飽和度和50％亮度，對於「高光」色使用100％飽和度，並且使用80％亮度。只要繼續點擊「運行代碼片斷」按鈕即可查看更多隨機顏色。

document.querySelectorAll('div').forEach(d => { 
 
    const hue = Math.floor(Math.random() * 360); 
 
    d.style.backgroundColor = `hsl(${hue}, 100%, 50%)`; 
 
    d.style.borderColor  = `hsl(${hue}, 100%, 80%)`; 
 
});

div { 
 
    display: inline-block; 
 
    width: 20px; 
 
    height: 20px; 
 
    border: solid 5px; 
 
    margin: 5px; 
 
}

<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div> 
 
<div></div>