echarts居左_echarts4.0⼀个div下多个柱状图主标题居中，副
标题居左⽆效，。。。
<!-- 创建⼀个具备⼀定宽⾼的DOM容器 -->
<div id='main' style='width:100%;height:100%'></div>
<script>
//基于创建好的DOM，初始化⼀个echarts实例
var myChart = echarts.ElementById('main'));
//指定图表的配置项和数据
var json=[{
"code": {
"1001": "55",
"1002": "49",
"1003": "36",
"1004": "25",
"1005": "55",
"1006": "49",
"1007": "36",
"1008": "25"
},
"getTime": "2018-06-12 09:29:35",
"name": "41w14-驾驶证",
"service_id": "41000014"
}, {
"code": {
"1006": "25",
"1004": "46",
"1003": "78",
"1001": "10"
},
"getTime": "2018-06-12 09:29:35",
"name": "4104-新⾏驶证",
"service_id": "41000004"
"code": {
"1001": "55",
"1002": "49",
"1003": "36",
"1004": "25",
"1005": "55",
"1006": "49",
"1007": "36",
"1008": "25"
},
"getTime": "2018-06-12 09:29:35",
"name": "4039-出险",
"service_id": "40000039"
}]
var option = {
color:['#5793f3', '#d14a61', '#675bba','#546570','#d48265','#c4ccd3'], //分别设置标题居中主要代码
title:[
{
text:'服务状态码出现量',
left:'48%',
top:'0%',
textAlign:'center'
},
{
text:'',
subtext: '',
subtextStyle:{
align: 'left',
rich: {
a: {
// 没有设置 `align`，则 `align` 为 right
}
verticalAlign: 'top', },
left:'18%',
top:'6%', textAlign:'center' },
{
text:'',
subtext: '',
left:'48%',
top:'6%', textAlign:'center' },
{
text:'',
subtext: '',
left:'80%',
top:'6%', textAlign:'center' },
{
text:'',
subtext: '',
left:'18%',
top:'50%', textAlign:'center' },
{
text:'',
subtext: '',
left:'48%',
top:'50%', textAlign:'center'
{
text:"",
subtext: '',
left:'80%',
top:'50%',
textAlign:'center'
},
],
grid:[
{x:'7%',y:'12%',width:'23%',height:'35%'},
{x:'37%',y:'12%',width:'23%',height:'35%'},
{x2:'7%',y:'12%',width:'23%',height:'35%'},
{x:'7%',y2:'7%',width:'23%',height:'35%'},
{x2:'40%',y:'58%',width:'23%',height:'35%'},
{x2:'7%',y2:'7%',width:'23%',height:'35%'},
],
tooltip:{
trigger: 'axis',
axisPointer : {            // 坐标轴指⽰器，坐标轴触发有效
type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow' }
},
xAxis:[
{
gridIndex:0,
type : 'category',
data : []
},
{
gridIndex:1,
type : 'category',
data : []
},
gridIndex:2,
type : 'category',
div中的div居中
data : []
},
{
gridIndex:3,
type : 'category',
data : []
},
{
gridIndex:4,
type : 'category',
data : []
},
{
gridIndex:5,
type : 'category',
data : []
}
],
yAxis:[
{gridIndex:0}, {gridIndex:1}, {gridIndex:2}, {gridIndex:3}, {gridIndex:4}, {gridIndex:5}
],
series:[
{
name:'4059-驾驶证服务', type:'bar',
xAxisIndex:0,

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。