我正在研究一个 SVG 仪表,当范围滑块在带有渐变颜色的活动笔划填充上移动时,我想将半圆分成几部分。并想在表针移动时再添加一条黑色运行轨迹。我曾尝试使用stroke-dasharray,但添加此后,所有颜色都会在时间计无法正常工作时出现。
我的代码在这里
/* set radius for all circles */
var r = 400;
var circles = document.querySelectorAll('.circle');
var total_circles = circles.length;
for (var i = 0; i < total_circles; i++) {
circles[i].setAttribute('r', r);
}
/* set meter's wrapper dimension */
var meter_dimension = (r * 2) + 100;
var wrapper = document.querySelector('#wrapper');
wrapper.style.width = meter_dimension + 'px';
wrapper.style.height = meter_dimension + 'px';
/* add strokes to circles */
var cf = 2 * Math.PI …Run Code Online (Sandbox Code Playgroud)