基于vue+echarts+koa2实现电商数据可视化系统源码+运行说明.zip

共79个文件

json：42个

png：9个

js：8个

版权申诉

课程设计

项目源码

vue

echarts

115 浏览量 2023-11-28 12:09:07 上传评论收藏 4.24MB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

基于vue+echarts+koa2实现电商数据可视化系统源码+运行说明.zip （79个子文件）

babel.config.js 73B

src

App.vue 184B

assets

font

demo.css 8KB

demo_index.html 15KB

iconfont.ttf 3KB

iconfont.css 3KB

iconfont.json 2KB

iconfont.woff2 2KB

iconfont.js 13KB

iconfont.svg 12KB

iconfont.eot 3KB

iconfont.woff 2KB

logo.png 7KB

css

global.css 369B

global.less 296B

main.js 863B

components

Trend.vue 6KB

Seller.vue 7KB

router

index.js 473B

views

TrendPage.vue 208B

SellerPage.vue 434B

jsconfig.json 279B

public.zip 2.04MB

package.json 975B

public

favicon.ico 4KB

index.html 836B

static

lib

echarts.min.js 734KB

map

world.json 987KB

china.json 60KB

province

tianjin.json 10KB

guangdong.json 70KB

shandong.json 49KB

hunan.json 44KB

taiwan.json 8KB

hebei.json 38KB

henan.json 35KB

fujian.json 42KB

yunnan.json 61KB

zhejiang.json 50KB

guizhou.json 31KB

shanxi.json 22KB

neimenggu.json 56KB

gansu.json 46KB

heilongjiang.json 77KB

aomen.json 2KB

xianggang.json 12KB

hubei.json 38KB

xizang.json 44KB

shanghai.json 12KB

liaoning.json 49KB

jiangsu.json 23KB

qinghai.json 43KB

beijing.json 21KB

xinjiang.json 84KB

jilin.json 40KB

jiangxi.json 31KB

guangxi.json 46KB

ningxia.json 12KB

shanxi1.json 30KB

hainan.json 28KB

anhui.json 30KB

sichuan.json 82KB

chongqing.json 46KB

china-cities.json 1.15MB

china-contour.json 9KB

img

logo1.png 6KB

qiehuan_light.png 2KB

header_border_dark.png 8KB

logo_light2.png 8KB

logo2.png 6KB

header_border_light.png 522KB

qiehuan_dark.png 1KB

logo_dark.png 6KB

theme

chalk.js 14KB

vintage.js 14KB

package-lock.json 344KB

vue.config.js 327B

src.zip 41KB

使用介绍.md 309B

<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>IconFont Demo</title> <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/> <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css"> <link rel="stylesheet" href="demo.css"> <link rel="stylesheet" href="iconfont.css"> <script src="iconfont.js"></script>  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script> </head> <body> <div class="main"> <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank"></a></h1> <div class="nav-tabs"> <ul id="tabs" class="dib-box"> <li class="dib active"><span>Unicode</span></li> <li class="dib"><span>Font class</span></li> <li class="dib"><span>Symbol</span></li> </ul> <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1525688" target="_blank" class="nav-more">查看项目</a> </div> <div class="tab-container"> <div class="content unicode" style="display: block;"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont"></span> <div class="name">compress-alt</div> <div class="code-name">&#xe825;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">expand-alt</div> <div class="code-name">&#xe826;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">sort-line</div> <div class="code-name">&#xe836;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">switch</div> <div class="code-name">&#xe837;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow-down</div> <div class="code-name">&#xe6eb;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow-right</div> <div class="code-name">&#xe6ed;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow-up</div> <div class="code-name">&#xe6ee;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">arrow-lift</div> <div class="code-name">&#xe6ef;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">move</div> <div class="code-name">&#xe6fc;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">sorting</div> <div class="code-name">&#xe708;</div> </li> <li class="dib"> <span class="icon iconfont"></span> <div class="name">exchange rate</div> <div class="code-name">&#xe715;</div> </li> </ul> <div class="article markdown"> <h2 id="unicode-">Unicode 引用</h2> <hr> <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p> <ul> <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li> <li>支持按字体的方式去动态调整图标大小，颜色等等。</li> <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li> </ul> <blockquote> <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p> </blockquote> <p>Unicode 使用步骤如下：</p> <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3> <pre><code class="language-css" >@font-face { font-family: 'iconfont'; src: url('iconfont.eot'); src: url('iconfont.eot?#iefix') format('embedded-opentype'), url('iconfont.woff2') format('woff2'), url('iconfont.woff') format('woff'), url('iconfont.ttf') format('truetype'), url('iconfont.svg#iconfont') format('svg'); } </code></pre> <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3> <pre><code class="language-css" >.iconfont { font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } </code></pre> <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3> <pre> <code class="language-html" ><span class="iconfont">&#x33;</span> </code></pre> <blockquote> <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p> </blockquote> </div> </div> <div class="content font-class"> <ul class="icon_lists dib-box"> <li class="dib"> <span class="icon iconfont icon-compress-alt"></span> <div class="name"> compress-alt </div> <div class="code-name">.icon-compress-alt </div> </li> <li class="dib"> <span class="icon iconfont icon-expand-alt"></span> <div class="name"> expand-alt </div> <div class="code-name">.icon-expand-alt </div> </li> <li class="dib"> <span class="icon iconfont icon-sort-line"></span> <div class="name"> sort-line </div> <div class="code-name">.icon-sort-line </div> </li> <li class="dib"> <span class="icon iconfont icon-switch"></span> <div class="name"> switch </div> <div class="code-name">.icon-switch </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-down"></span> <div class="name"> arrow-down </div> <div class="code-name">.icon-arrow-down </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-right"></span> <div class="name"> arrow-right </div> <div class="code-name">.icon-arrow-right </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-up"></span> <div class="name"> arrow-up </div> <div class="code-name">.icon-arrow-up </div> </li> <li class="dib"> <span class="icon iconfont icon-arrow-lift"></span> <div class="name"> arrow-lift </div> <div class="code-name">.icon-arrow

评论收藏

内容反馈

版权申诉