当前位置:首页 > 技术文章 > 正文内容

Echart可视化学习笔记(十)(echart数据可视化)

zonemu3个月前 (07-18)技术文章38

官网找到类似实例, 适当分析,并且引入到HTML页面中

代码也简单改一下

效果如下

在index.html中添加容器

在index.js中,完成立即执行函数

实例化对象

指定配置,将准备好的代码粘贴过来

把配置给实例对象

让图表跟随屏幕自动的去适应

查看效果

根据需求定制图表

定制图表需求1:

修改图例组件在底部并且居中显示。

每个小图标的宽度和高度修改为 10px

文字大小为12 颜色 rgba(255,255,255,.5)

查看效果

定制需求2:

修改水平居中 垂直居中

修改内圆半径和外圆半径为 ["40%", "60%"]

带有直角坐标系的比如折线图柱状图是 grid修改图形大小,而我们饼形图是通过 radius 修改大小

查看效果

定制需求3:更换数据

legend 中的data可省略(前面已经删除)

series 中的数据

修改下颜色

查看效果

相关文章

用IDEA开发如何用Git快速拉取指定分支代码?

1,准备空的文件夹,git init2,关联远程仓库,git remote add origin gitlab地址3,拉取远程分支代码,git pull origin 远程分支名再用IDEA打开项目即...

Gitlab 的使用和代码审查流程介绍

1、先简洁介绍下项目常用的信息-面板统计页面2、用户信息面板3、服务器信息4、项目信息5、重点介绍代码提交审核机制和授权合并机制开发人员推送代码的时候不能直接推送到master,否则就会报错。此时开发...

如何使用git clone克隆包含子模块的仓库

技术背景在软件开发中,当项目规模逐渐增大时,为了更好地管理代码,我们常常会使用子模块将项目拆分成多个独立的部分。Git 作为目前最流行的版本控制系统,提供了管理子模块的功能。但在克隆包含子模块的仓库时...

(一)熟练HTML5+CSS3,每天复习一遍

前言学习网页的概念和分类,了解静态网页和动态网页的不同;了解网页浏览器的工作原理。了解HTML,XHTML,HTML5的概念,制作简单的HTML页面的开发。什么是网页可以在internet上通过网页浏...

HTML5培训学习(简单明了)(html5教学视频教程)

这些事HTML5培训认为在学习HTML5前应该做好的准备,欢迎参考指正:为什么学习HTML5?软硬件环境介绍HTML5环境搭建常见问题解决掌握技能需求为什么学习HTML5?1:自从2010年HTML5...

JavaScript 数组的常用方法(javascript数组的常用方法)

在我们前端来说数组作为一个常用的类型,今天我们讲一下在实际使用中经常用到的方法和使用场景。concat() 多数组组合concat() 可以用来连接两个或多个数组,返回要给新的数组并且不会影响之前的数...