ECharts grid组件离容器的距离
ECharts grid组件离容器的距离
grid.left | string, number
[ default: '10%' ]
grid 组件离容器左侧的距离。
left 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,也可以是 'left', 'center', 'right'。
如果 left 的值为'left', 'center', 'right',组件会根据相应的位置自动对齐。
grid.top | string, number
[ default: 60 ]
grid 组件离容器上侧的距离。
top 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比,也可以是 'top', 'middle', 'bottom'。
如果 top 的值为'top', 'middle', 'bottom',组件会根据相应的位置自动对齐。
grid.right | string, number
[ default: '10%' ]
grid 组件离容器右侧的距离。
right 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。
grid.bottom | string, number
[ default: 60 ]
grid 组件离容器下侧的距离。
bottom 的值可以是像 20 这样的具体像素值,可以是像 '20%' 这样相对于容器高宽的百分比。
grid.width | string, number
[ default: 'auto' ]
grid 组件的宽度。默认自适应。
grid.height | string, number
[ default: 'auto' ]
grid 组件的高度。默认自适应。
以上来自官方api
项目实例:
grid: {
left: '3%',
right: '3%',
bottom: '5%',// 这几个属性可以控制图表上下左右的空白尺寸,可以自己试试。
containLabel: true
},
dataZoom: dataZooms,//滚动条的实现
ECharts grid组件离容器的距离的更多相关文章
- 转:ECharts图表组件之简单关系图:如何轻松实现另类站点地图且扩展节点属性实现点击节点页面跳转
站点地图不外乎就是罗列一个网站的层次结构,提炼地讲就是一个关系结构图.那么我们如何巧用ECharts图表组件内的简单关系结构图来实现一个站点的地图结构呢?另外如何点击某个节点的时候实现页面跳转呢? 针 ...
- 转:ECharts图表组件入门教程之Theme:ECharts图表的皮肤是什么?如何给图表换主题(皮肤)Theme?
一.什么是ECharts图表的皮肤(主题)? 针对这个问题我只能这样回答,ECharts图表的主题(皮肤)就犹如人的衣服一样,是用来衬托和渲染主体,使其变得更加美观好看的目的.你去过ECharts图表 ...
- vue-cli ——解决多次复用含有Echarts图表组件的问题
在vue项目里,组件复用是一件很开心的事,可以节省很多时间去排版,达到事半功倍效果,但是昨晚在vue-cli项目里组件复用时发现基于Echarts图表的组件不能够复用,昨晚捯饬了很久,终于还是解决了这 ...
- ECharts公共组件:title详解、 tooltip详解、toolbox详解、legend详解、dataZoom详解、visualMap全解
1. Title mytextStyle={ color:"#333", //文字颜色 fontStyle:"norm ...
- 在Vue中echarts可视化组件的使用
echarts组件官网地址:https://echarts.apache.org/examples/zh/index.html 1.找到脚手架项目所在地址,执行cnpm install echarts ...
- ExtJS 4.2 Grid组件的单元格合并
ExtJS 4.2 Grid组件本身并没有提供单元格合并功能,需要自己实现这个功能. 目录 1. 原理 2. 多列合并 3. 代码与在线演示 1. 原理 1.1 HTML代码分析 首先创建一个Grid ...
- 千万用户级别应用系统背后的SOA组件化容器
背景 在<我们的应用系统是如何支撑千万级别用户的>随笔中已经从“宏观”角度去介绍了整个应用系统的布局.组件化是整个系统由头到尾都始终坚持的一个设计原则,其中“SOA组件化容器”也是我们应用 ...
- Ligerui Grid组件--学生信息列表
一.目录 1.多层架构+MVC+EF+AUTOFAC+AUTOMAPPER: 2.MVC中验证码的实现(经常用,记录备用) 3.Ligerui首页的快速搭建 4.Ligerui Grid组件--学生信 ...
- 浅谈surging服务引擎中的rabbitmq组件和容器化部署
1.前言 上个星期完成了surging 的0.9.0.1 更新工作,此版本通过nuget下载引擎组件,下载后,无需通过代码build集成,引擎会通过Sidecar模式自动扫描装配异构组件来构建服务引擎 ...
随机推荐
- 爬虫爬取m3u8视频文件
一.m3u8视频格式 一般m3u8文件和 视频流ts文件放在同一目录 而m3u8文件格式存放的一般都是ts 文件的一个列表 二.根据m3u8视频存放以及写法的规律 思路 我们一般网站上能找到的m3u8 ...
- Vue中调用另一个组件中自定义事件
之前在一个场景中,遇到组件需要调用父组件中的方法tableInit(),字组件调用父组件常用的有三种方法,具体参考:https://www.cnblogs.com/jin-zhe/p/9523782. ...
- word-break、word-wrap、white-space区别
<div id="box"> Hi , This is a incomprehensibilities long word. </br> 你好 , 这 ...
- SAP 不支持交货单中同一个物料多个行项目HU与序列号组合发货场景
SAP 不支持交货单中同一个物料多个行项目HU与序列号组合发货场景 笔者所在的项目里,后勤业务启用了序列号管理,Handling Unit Manager以及批次号管理.不同的物料分别启用序列号管理, ...
- nginx实现基础web
目录 nginx实现基础web 什么是lnmp lnmp架构如何工作 Nginx与Fast-CGO详细工作流程 LNMP环境准备 一,部署LNMP 1.使用nginx官方源 2.创建nginx用户 3 ...
- SQL Server有意思的数据类型隐式转换问题
写这篇文章的时候,还真不知道如何取名,也不知道这个该如何将其归类.这个是同事遇到的一个案例,案例比较复杂,这里抽丝剥茧,仅仅构造一个简单的案例来展现一下这个问题.我们先构造测试数据,如下所示: CRE ...
- android tween animation合集
自己写的一些tween animation动画xml文件,可用于activity切换,图片切换动画等 http://files.cnblogs.com/zj2012zy/anim.rar
- Scrapy的Spider类和CrawlSpider类
Scrapy shell 用来调试Scrapy 项目代码的 命令行工具,启动的时候预定义了Scrapy的一些对象 设置 shell Scrapy 的shell是基于运行环境中的python 解释器sh ...
- Java笔记(持续更新)
码云地址 https://gitee.com/MarkPolaris/Java_Mark
- css的伪元素 ::after ::before 和 图标字体的使用
浅谈css的伪元素::after和::before css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁.但是很多人对::after和 ...