仪陇家园分类信息网、仪陇生活网、仪陇家园网

搜索

【Echarts图表模块示例源码】GDP增长动态变化效果 [复制链接]

[复制链接]
seo 发表于 2023-9-24 13:49:07 | 显示全部楼层 |阅读模式


Echarts图表模块使用示例
GDP增长动态变化效果

源码主要为演示Echarts的自由度,希望在使用中不要被模块本身限制,echarts本身的实力是无限的,更多的效果还是需要发挥想象力+查阅文档+自己上手调配参数。
本示例中除了创建基本图形使用了模块本身的生成命令,另外主要演示了通过查阅官方文档手动配置json来生成自己想要的效果(源码中自定义配置的都有附带官方文档的地址)。
注:
echarts模块当前最新版是
[color=]v1.7.0.328(内核echarts.min.js版本v5.2.2

因为工作关系好久没有玩这个了,今天看b站的gdp变化视频突然就想用易来做一下,本来想顺便更新一下模块的,但是发现官网的echarts.js最新版5.4好像已经放弃对ie支持了(无法用超文本浏览框调用了),所以就暂时还是不更新模块了。
Echarts模块详细介绍:Echarts商业级数据图表库模块v1.7.0.328【模块及示例大全】
https://bbs.125.la/forum.php?mod=viewthread&tid=14708561


补上单独设置颜色的效果和方法
本来想在示例中直接实现的,但是感觉写出来代码太多会让新手望而生畏就没写
其实也很简单,可以参考文档:https://echarts.apache.org/zh/option.html#series-bar.data.itemStyle.color
默认的数据数组data(也就是json配置中的series.data)里只是一个数据数组,要单独为其配置颜色就把颜色也写到这里就行里
示例1:series.data中不包含颜色
示例2:serires.data中包含颜色

实现步骤1.生成带颜色图形:

生成步骤2.刷新数据(和原来不带颜色的data路径不一样,所以也要改一下)

            

            
            点我下载
            (已有 19 次下载)
            

            
            
        

        
               
            引用模块
            
            
            
源码文件名模块文件名
echarts示例_动态柱图.e
                        
Echarts模块.ec

                        
                                            
回复

使用道具 举报

全部回复0 显示全部楼层

发表回复

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

楼主

审核员

热门推荐

联系客服 关注微信 下载APP 返回顶部 返回列表