zoukankan      html  css  js  c++  java
  • ECharts 经常会修改到的一些样式配置

    1.坐标轴:

     1 axisLine:{              //坐标轴轴线相关设置。
     2   show:true,        //是否显示坐标轴轴线。
     3   lineStyle:{
     4     10           //坐标轴线线宽。 
     5     color:#333        //颜色。
     6     color:{
     7       colorStops:[{
     8         offset:0,color:'red',     //渐变的颜色
     9         offset:1,color:'bule'
    10       }],
    11     shadowColor:'red'     //阴影的颜色
    12     shadowBlur:10     //阴影的宽度
    13     }
    14   }       
    15 }
    16  
    17 axisLabel:{          //坐标轴刻度标签的相关设置(坐标字体)
    18     show:true       //是否显示
    19     rotate:45       //旋转的角度从 -90 度到 90 度。
    20     margin:25       //刻度标签与轴线之间的距离。
    21     color:#ffff       //字体颜色.
    22     fontStyle:normal  italic  oblique //文字的风格。
    23     fontWeight:20   //文字的粗细。
    24     fontSize:18    //文字的大小。
    25     shadowColor:18  //文字块的背景阴影长度。
    26 }

    2.标题:

     1 "title": {
     2   "text": '全国机电产品出口总值',    //标题
     3    subtext: '机电产品',         //副标题
     4   "top": '85%',
     5   "left": '28%',
     6   "textStyle": {            //标题的文字样式
     7     "fontSize": 16,
     8     "color": "#444",
     9     "text-align": "center",
    10     "margin-top":"20px"
    11   }
    12 },
     
     

    3.数据类型显示(图例):

    legend:{
      x: 'right',
      icon:'pin',                 //形状 ('circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow')
      data: ['6月份','7月份'],
      fontSize:18 
      left:20%    //位置设置可以(center ,  right)
      padding      //它们之间的距离
    }
     
     
     
  • 相关阅读:
    vue获取当前v-for里当前点击元素
    js利用正则替换图片路径问题
    undefined null 各种值比较(面试题)
    SSE两个页面的相互通信
    微信小程序导航栏,下面内容滑动,上册导航栏跟着滑动,内容随着导航栏滑动
    微信小程序缓存滑动距离,当页面浏览到一定位置,滑动其他页面后返回该页面记录之前的滑动距离
    ajax拖拽上传文件
    Java 面向对象(四)
    关于Scanner调用 sc.nextInt() 异常try后不能二次输入导致死循环问题
    Java 面向对象(三)
  • 原文地址:https://www.cnblogs.com/huhanhaha/p/7466208.html
Copyright © 2011-2022 走看看