echarts字体大小调整，坐标轴name设置等一些问题

关于echarts的一些配置

一下记录中的记录规则，尽量以echarts对应的数据进行说明，#prop#表示可以设置的值

总结一下echarts的配置，方便扩展
（-）字体调整
1.1 坐标轴字体大小调整：

"yAxis":[{"axisLabel":fontSize:#fontSize#}] 或者 "xAxis":[{"axisLabel":fontSize:#fontSize#}]

 

 

 1.2 图表标题大小调整：

"title":[{textStyle:{"fontSize" : #fontSize#}}]

 

1.3 坐标轴的name大小设置：

"yAxis":[{"nameTextStyle":{ "fontSize":#fontSize#}}] 
或者 

"xAxis":[{"nameTextStyle":{ "fontSize":#fontSize#}}]

 

1.4坐标轴label字体旋转 

"xAxis"：[{"axisLabel":{"rotate":60}}] 或者 "yAxis"：[{"axisLabel":{"rotate":60}}] 

 

 （二）颜色调整

 1.1：坐标轴字体颜色调整

"xAxis":[{"nameTextStyle":{"color":"red"}}]    坐标轴name颜色 

 

 

   "xAxis":[{"axisLabel":{"color":"red"}}]          坐标轴刻度label颜色

 

 1.2：坐标轴背景颜色调整

 "backgroundColor":"black"

 

  1.3：柱子颜色调整

"series":[{
                "itemStyle": {   
                        //通常情况下：
                        normal:{
                                //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
                            color: function (params){
                                return "#FFF";
                            }
                        }
                    }
     }]

 

  1.4：柱子颜色循环显示

"series":[{
                "itemStyle": {
                        normal:{
                                //每个柱子的颜色即为colorList数组里的每一项，如果柱子数目多于colorList的长度，则柱子颜色循环使用该数组
                            color: function (params){
                                var colorList = ['#000000','#FF0000','#00FF00','#0000FF','#00FFFF','#C0C0C0'];
                                var colorIndex = params.dataIndex;
                                if(params.dataIndex >= colorList.length){
                                        colorIndex = params.dataIndex % colorList.length == 0?0:params.dataIndex % colorList.length;
                                }
                                return colorList[colorIndex];
                            }
                        }
                    }
     }]

 

 （三）数据取整数 echarts默认坐标轴数据出险小数

 "xAxis":[{ "minInterval": 1}]

 

 （四）柱子大小调整

   1.1：柱子大小调整

"series":[{"barWidth":18}]

 

 （六）坐标轴数据做运算二次处理

"yAxis":[{"axisLabel":
                                             formatter: function(params){
                                                        return (params/1000) + "k";
                                                }
                                             }]

 

 （七）折线实心

 "series":[{
                                "symbol": 'circle',     //折点设定为实心点
                                    "symbolSize": 15,   //设定实心点的大小
                }]

 (8)图表位置调整 【转载自https://www.cnblogs.com/weixing/p/9578535.html】

条形图/树状图
        grid:{
                    x:25,
                    y:45,
                    x2:5,
                    y2:20,
                    borderWidth:1
                }
或者

grid:{
                    left:'8%',
                    right:'0',
                    bottom:'1%',
                    containLabel:true
                }

 [此图转载其他地方 https://www.cnblogs.com/weixing/p/9578535.html ]

 

 

 

饼图："series":[{"type": "pie",
                              "center": [
                                     "20%",  //x 左上角
                                     "30%"   //y 左上角
                                 ]
                        }]