Echarts3 主题设置

来源:互联网 发布:ping用的是什么端口 编辑:程序博客网 时间:2024/06/08 14:07

前言

现在此感谢百度Echarts团队提供的这款优秀的开源产品。Echarts是一款原生js写的图表类库,Echarts能为我们打造一款数据可视化平台提供了良好的图表支持。在如今的前端开发中,站点样式主题css 是要和样式组件的css样式分离的,这样我们就可以根据不同的需求改变我们的站点风格,如春节、中秋等节假日我们都要改变我们的站点风格。同理,百度Echarts团队也为我们提供了这样一套机制(类是Bootstrap的定制,如果没玩过bootstrap就赶紧尝尝鲜)。

Echarts3的在线构建主题:http://echarts.baidu.com/theme-builder/
Echarts3在线构建JS组件(看你最终的需求,需要那些组件,减低js的重量):http://echarts.baidu.com/builder.html
地图的JSON地名提供:http://echarts.baidu.com/download-map.html
Echarts3的主题下载:http://echarts.baidu.com/download-theme.html

Echarts3主题的使用

<script src="echarts.js"></script><!-- 引入 vintage 主题 --><script src="theme/vintage.js"></script><script>// 第二个参数可以指定前面引入的主题var chart = echarts.init(document.getElementById('main'), 'vintage');chart.setOption({    ...});</script>

echarts整体给我的感觉有点像vue 的数据驱动View 的实现。希望能为你们的站点提供匹配的数据展示的主题风格。下面的几个主题风格是Echarts官方为我们提供的几种风格。
这里写图片描述

0 0