大屏展示 JS中随机颜色 exchart使用

最新推荐文章于 2024-03-25 10:15:00 发布

ShawnWang04

最新推荐文章于 2024-03-25 10:15:00 发布

阅读量235

点赞数

分类专栏：前端文章标签： js javascript jquery css html

本文链接：https://blog.csdn.net/Wang________/article/details/109650397

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

随机rgb颜色和 rgba颜色

function rgbColor(){
    let r = Math.floor(Math.random()*256);
    let g = Math.floor(Math.random()*256);
    let b = Math.floor(Math.random()*256);
    var rgb = 'rgb('+r+','+g+','+b+')';
    return rgb;
}

function rgbaColor(){
        let r = Math.floor(Math.random()*256);
        let g = Math.floor(Math.random()*256);
        let b = Math.floor(Math.random()*256);
        let a = Math.random().toFixed(2);
        let rgba = 'rgba('+r+','+g+','+b+','+a+')';
        return rgba;
}

在exchart 列表使用push动态化赋值

for(var i=0;i<baseServiceByStatusaAndDaPingList.length;i++){
     option2.legend.data.push(baseServiceByStatusaAndDaPingList[i])
}

 option2.series.push(
       {
             name: key,
             type: 'line',
             smooth: true,
             lineStyle: {
               	   normal: {
               		     width: 2
               		   }
             },
             areaStyle: {
               	    normal: {
               		     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
               		     offset: 0,
               		     color: rgbaColor()
               		   }, {
               		         offset: 0.8,
               		         color: rgbaColor()
               		      }], false),
               		          shadowColor: rgbaColor(),
               		          shadowBlur: 10
               		    }
             },
             itemStyle: {
               		 normal: {
               		       color: rgbColor()
               		     }
             },
               	     data: mapList[key]
       }
);