progressbar.js -> 更改我的进度条轨迹的颜色

Question

I got a progress bar like this one jsfiddle and I would like to change the color of the trail which is by default white.

 // progressbar.js@1.0.0 version is used var bar = new ProgressBar.Circle(container, { color: '#aaa', // This has to be the same size as the maximum width to // prevent clipping strokeWidth: 4, trailWidth: 1, easing: 'easeInOut', duration: 1400, text: { autoStyleContainer: false }, from: { color: '#aaa', width: 1 }, to: { color: '#333', width: 4 }, // Set default step function for all animate calls step: function(state, circle) { circle.path.setAttribute('stroke', state.color); circle.path.setAttribute('stroke-width', state.width); var value = Math.round(circle.value() * 100); if (value === 0) { circle.setText(''); } else { circle.setText(value); } } }); bar.text.style.fontFamily = '"Raleway", Helvetica, sans-serif'; bar.text.style.fontSize = '2rem'; bar.animate(1.0); // Number from 0.0 to 1.0

 #container { margin: 20 px; width: 200 px; height: 200 px; position: relative; }

 <link href="https://fonts.googleapis.com/css?family=Raleway:400,300,600,800,900" rel="stylesheet" type="text/css"> <div id="container"></div>

The "white bar" under the purple bar in this example

Do you have an idea how can I do that ?

Thanks in advance

Answer 1

You can simply add trailColor property and set its value.
Example: trailColor: 'silver',