echarts画四分之一玫瑰图

最新推荐文章于 2022-02-25 12:37:35 发布

睡不着你数羊啊

最新推荐文章于 2022-02-25 12:37:35 发布

阅读量557

点赞数 1

文章标签： echarts

本文链接：https://blog.csdn.net/qq_41952476/article/details/113109259

版权

效果
在这里插入图片描述
代码

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>四分之一玫瑰图</title>
    <script src="https://lib.baomitu.com/echarts/5.0.1/echarts.common.js"></script>
    <style>
      .number {
   
        width: 90%;
        white-space: nowrap;
        text-align: right;
      }
      .value {
   
        font-size: 14px;
        height: 21px;
        color: rgba(255, 255, 255, 0.7);
        width: 90%;
        display: flex;
        justify-content: space-between;
      }
      .line {
   
        width: 90%;
        height: 1px;
        background-color: transparent;
        border-top: 1px solid rgba(255, 255, 255, 0.7);
      }
      .chart-axis {
   
        width: 100%;
        position: absolute;
      }
      .chart {
   
        width: 100%;
        height: 100%;
      }
      .quarter-rose-container {
   
        position: relative;
        width: 600px;
        height: 600px;
        background-color: #2c3e50;
      }
    </style>

最低0.47元/天解锁文章

睡不着你数羊啊

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
echarts画四分之一玫瑰图

效果代码<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
复制链接

扫一扫