echarts的仪表盘

最新推荐文章于 2024-10-11 20:40:21 发布

lude1994

最新推荐文章于 2024-10-11 20:40:21 发布

阅读量1.8k

点赞数 1

分类专栏： echarts 文章标签： echarts 仪表盘

本文链接：https://blog.csdn.net/qq_32007439/article/details/80923398

版权

本文介绍了如何利用Echarts库创建仪表盘，特别是封装了一个函数，用于生成具有自定义ID和百分比显示的仪表盘组件。该函数可以方便地重复用于创建多个不同的仪表盘。

摘要由CSDN通过智能技术生成

需要写3个仪表盘，这里写了一个函数：

绿色的背景是div的背景

 
  warnFunc = ( 
  id, 
  dataValue) 
  => { 
 
 
  // 基于准备好的dom，初始化echarts实例 
 
 
  let 
  wranIndex1 = 
  document. 
  getElementById( 
  ` 
  ${
    
  id 
  } 
  `); 
 
 
  // 设置canvas的高度 
 
 
  let 
  canvasHeight = 
  function () { 
 
 
  wranIndex1. 
  style. 
  height = 
  100 + 
  'px'; 
 
 
  console. 
  log( 
  wranIndex1. 
  style. 
  height, 
  '能获取高度吗') 
 

   } 
 
 
  canvasHeight(); 
 
 
  //先设置以上，高度才能生效，位置不要变 
 
 
  var 
  myChart = 
  echarts. 
  init( 
 