Я нашел часы JavaScript в Интернете. Я хочу изменить цвет кругов, но не могу понять, как это сделать.
Это часы: https://codepen.io/Escu/pen/wMZpQz
Это код, в котором рисуются круги:
Object.keys(circles).forEach((k, i) => {
ctx.beginPath();
circles[k].update(times[k]);
ctx.strokeStyle = "hsl(" + k.charCodeAt(0) * i + ", 50%, 50%)";
ctx.stroke();
});
Как изменить цвета кругов? Например, часы должны быть красными, зелеными и зелеными секундами.
Вы можете попробовать такой подход:
var colors = [0, 77, 166];
//update circles, set their color, draw
Object.keys(circles).forEach((k, i) => {
ctx.beginPath();
circles[k].update(times[k]);
// hsl(hue, saturation, lightness)
ctx.strokeStyle = "hsl(" + colors[i] + ", 50%, 50%)";
ctx.stroke();
});
Вы можете использовать другие цветовые функции, например:
var colors = ["blue", "#ff0000", "rgb(200, 0, 200)"];
//update circles, set their color, draw
Object.keys(circles).forEach((k, i) => {
ctx.beginPath();
circles[k].update(times[k]);
ctx.strokeStyle = colors[i];
ctx.stroke();
});