echars渲染

/* 是否显示整个x轴线 */

        /* show:true, */

        axisLine: {

          /* 是否显示x轴的水平线(不包括刻度线) */

          show: true,

          /* 控制整个x轴的颜色 */

          lineStyle: {

            color: {

              type: "linear",

              x: 0,

              y: 0,

              /* 颜色变化的顺序为从左到右 */

              x2: 1,

              y2: 0,

              colorStops: [

                {

                  offset: 0,

                  color: "red",

                },

                {

                  offset: 1,

                  color: "blue",

                },

              ],

              global: false,

            },

            width: 5,

          },

        },

        /* 刻度线的设置 */

        axisTick:{

          /* 是否显示刻度线 */

          show:true,

          /* 刻度线是否在柱子的中间位置显示 */

          alignWithLabel:true,

          /* true刻度线显示在水平线的上方 false刻度线显示在水平线的下方 */

          inside:false,

          /* 控制刻度线的长度 */

          length:10,

          /* 设置刻度线的颜色样式 */

          lineStyle:{

            /* 设置颜色 */

            color:'green',

            /* 设置颜色的模糊度 */

            shadowBlur:4,

            /* 设置模糊颜色 */

            shadowColor:'red'

          },

        },

        /* x轴文字的样式 */

        axisLabel: {

          color:'blue',

          /* 显示所有的x轴的数据 */

          interval: 0,

          /* 放不下的倾斜角度 */

          rotate: 0,

          /* 数据距离顶部刻度线上面的距离 */

          margin: 15,

        },

        /* x轴的网格线 */

        splitLine:{

          /* 是否显示网格线 */

          show:true,

          /* 网格线的颜色样式  */

          lineStyle:{

            color:'#007ACC'

          }

yAxis: {

        /* y轴的网格线 */

        splitLine:{

          /* 是否显示网格线 */

          show:true,

          /* 网格线的颜色样式  */

          lineStyle:{

            color:'#007ACC'

          }

        },

        /* 不显示y轴的垂直线 */

        axisLine: {

          show:false,

        }

      },

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容