echarts 大屏展示系统，前端静态模板

wwwarewow

已于 2024-06-04 08:23:32 修改

阅读量291

点赞数 2

分类专栏：大屏模板文章标签：前端 echarts javascript

于 2024-06-04 08:20:44 首次发布

本文链接：https://blog.csdn.net/JSPSEO/article/details/139429010

版权

大屏模板专栏收录该内容

12 篇文章 0 订阅

订阅专栏

效果图

代码

<section class="mainbox">
    <div class="column">
      <div class="panel bar">
        <h2>
          柱状图-各行业程序员数量 <a href="javascript:;">2019</a>
          <a href="javacript:;"> 2020</a>
        </h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
      <div class="panel line">
        <h2>折线图-学习变化</h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
      <div class="panel pie">
        <h2>饼形图-工程师年龄分布</h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
    </div>
    <div class="column">
      <div class="no">
        <div class="no-hd">
          <ul>
            <li>125811</li>
            <li>104563</li>
          </ul>
        </div>
        <div class="no-bd">
          <ul>
            <li>程序员需求人数</li>
            <li>程序员供应人数</li>
          </ul>
        </div>
      </div>
      <div class="map">
        <div class="chart"></div>
        <div class="map1"></div>
        <div class="map2"></div>
        <div class="map3"></div>
      </div>
    </div>
    <div class="column">
      <div class="panel bar1">
        <h2>柱状图-开发技能</h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
      <div class="panel line1">
        <h2>折线图-公司人员流动</h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
      <div class="panel pie1">
        <h2>饼形图-各地区程序员占比</h2>
        <div class="chart"></div>
        <div class="panel-footer"></div>
      </div>
    </div>
  </section>