zoukankan      html  css  js  c++  java
  • ECharts grid组件离容器的距离

    ECharts grid组件离容器的距离

    由 Carrie 创建, 最后一次修改 2017-09-04

    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,//滚动条的实现

  • 相关阅读:
    es6箭头函数
    es6数组必看太实用了
    对象和数组的解构以及数组的遍历4种写法
    es6 map数据类型,要比set还很多
    es6中对象的一些操坐
    class类
    webStorm配置es6转es5
    gulp-babel,es6转es5
    jquery扩展插件,让demo元素也可以resize
    【leetcode刷题笔记】Remove Nth Node From End of List
  • 原文地址:https://www.cnblogs.com/zxy-come-on/p/11574764.html
Copyright © 2011-2022 走看看