echarts学习

一般折线图绘图顺序(可以自己调整)

  1. 设置X、Y轴
  2. 设置标题
  3. 设置工具栏组件
  4. 设置区域缩放组件

几个设置项的名称

  • 设置标题(title)
  • 设置提示(tooltip)
  • 设置图例(legend)
  • 设置工具栏(toolbox)
  • 设置网格(grid)
  • 设置X、Y轴维度及度量
  • 设置区域填充(areaStyle)
  • 设置折线平滑(smooth)
  • 设置坐标轴留白(boundaryGap)

2019-7-25

先上效果图

1、标题位于环形图中间,且显示总数,文字格式自定义;

2、环形图局左,图例居右;

3、图例文字内容自定义、格式上下对齐

主要有以上三个技术点吧,其他的官网例子上都有,下面上代码:

<script type="text/javascript">
var piedata=[    //环形图的数据
                {value:335, name:'直接访问abc'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟'},
                {value:135

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ECharts是一个开源的数据可视化工具,可以用于在PC端和移动设备上创建交互式的数据图表。如果你想学习ECharts,以下是一个学习路线图供参考: 1. 官方文档:首先,你可以阅读ECharts的官方文档,文档地址为https://echarts.apache.org/zh/option.html。官方文档提供了详细的API说明和示例,可以帮助你了解ECharts的基本概念和用法。 2. 示例代码:通过查看和实践一些示例代码,你可以更好地理解ECharts的用法。在官方文档中,有很多示例代码可以参考,你可以根据自己的需求选择合适的示例进行学习。 3. 官方教程:ECharts官方网站提供了一些教程,可以帮助你更深入地了解如何使用ECharts创建各种类型的图表。你可以在官网的教程部分找到这些教程。 4. 外部教程:除了官方文档和教程之外,还有一些外部教程可以帮助你学习ECharts。例如,W3Cschool提供了ECharts的教程,可以帮助你快速上手ECharts。你可以在W3Cschool的网站上找到这些教程。 5. 社区支持:如果在学习过程中遇到问题,你可以加入ECharts的官方社区或者其他相关的技术论坛,与其他用户交流并寻求帮助。在社区中,你可以了解到其他人的经验和分享,对于学习和解决问题都会有帮助。 总之,通过阅读官方文档、实践示例代码、参考教程并与社区互动,你可以逐步掌握ECharts的基本概念和用法,进而创建出自己想要的数据可视化图表。祝你学习顺利!<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [教你从零开始画echarts地图](https://blog.csdn.net/m0_67401660/article/details/126081326)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [ECharts学习路线图](https://blog.csdn.net/The_Time_Runner/article/details/103138016)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值