svg 带渐变色的环形进度条

var source = [{“name”:“环形进度条”,“width”:15},{“name”:“环形进度条”,“width”:25},{“name”:“环形进度条”,“width”:35}];
for (let i = 0; i < this.source.length; i++) {
htmlcode += <div class="svg-item" style="width: 300px;height: 160px;padding-bottom:20px;"> <svg width="300" height="160" viewBox="0 0 300 160" xmlns="http://www.w3.org/2000/svg"> <defs> <linearGradient id="orange_red" x1="0%" y1="0%" x2="100%" y2="100%"> <stop offset="0%" style="stop-color:rgb(80,52,168);stop-opacity:1"></stop> <stop offset="100%" style="stop-color:rgb(0,254,255);stop-opacity:1"></stop> </linearGradient> </defs> <circle cx="80" cy="80" r = "70" fill="none" stroke="#eee" stroke-width="4" transform="rotate(-90)"></circle> <circle cx="0" cy="0" r = "70" class="mycircle" id="progressRound" transform="translate(80,80)rotate(-90)"></circle> <text x="0" y="0" fill="white" class="txt" id="txt" transform="translate(170,25)">0</text> <text x="0" y="0" fill="white" transform="translate(40,84)">环形进度条</text> <polyline points="148,50 170,30 220,30" style="fill:none;stroke:#00feff;stroke-width:2;"> </svg> </div>
}

for (let j = 0; j < this.source.length; j++) {
let progressRound = $(".svg-item")[j];
let txt = $(".txt")[j]
// 进度数据，默认为 0
let jindu = 0;
// let roundLength = Math.PI2100;
let jinduLength = Math.PI20.7;
let goFun = ()=>{
jindu +=0.5 ;
let strokeLength = jinduLength*jindu ;
txt.innerHTML = jindu +"%";
// 更改环形样式，控制进度变化：实线段长度。
progressRound.style.strokeDasharray = strokeLength + " 1000";
// 如果进度为 100 ，那么终止计时器。
if(jindu===100){
clearInterval( myset );
}
};
// 启动计时器
let myset = setInterval(function(){
goFun();
},50);

乘号为什么不显示？？？