javascript - apache echarts中刻度之间的中心标签

Question

我正在使用apache echarts开发此图表，xAxis 类型为“时间”。在图表中，我需要：

• 在刻度之间居中标签（年份）
• 每年之间有一些利润/差距

我已阅读文档，但无法找到应设置此选项的位置。

下面的代码是我正在使用的当前设置：

// based on prepared DOM, initialize echarts instance
    var myChart = echarts.init(document.getElementById('main'));

    window.onresize = function() {
      myChart.resize();
    };

    myChart.setOption(option = {

        grid:{
            left: 70
        },

        legend:{},
        tooltip:{},
        dataZoom:{},

        xAxis: [
            {
                type: 'time',
                minInterval: 3600 * 1000 * 24 * 365,
                maxInterval: 3600 * 1000 * 24 * 365,
                splitArea: {
                    show: true,
                },
                axisLine:{
                    lineStyle:{ 
                        color: "#f00"
                    }
                },
                axisLabel:{
                    //align: 'left'
                }
            }
        ],
        
        yAxis: {},

        dataset: {
            source: [
['2019-01-08', 1.570921942700, 0, 0],
['2019-02-07', 1.710494269700, 0, 0],
['2019-03-11', 1.581125043700, 0, 0],
['2019-04-05', 1.559823060800, 0, 0],
['2019-05-08', 1.553159233000, 0, 0],
['2019-06-07', 1.597631953000, 0, 0],
['2019-07-05', 1.685369802000, 0, 0],
['2019-08-07', 1.690282023000, 0, 0],
['2019-09-06', 1.715973943000, 0, 0],
['2019-10-07', 1.707559853000, 0, 0],
['2019-11-07', 1.706540793000, 0, 0],
['2019-12-06', 1.634295833000, 0, 0],
['2020-01-08', 1.704343020000, 0, 0],
['2020-02-07', 1.618202437000, 0, 0],
['2020-03-06', 1.691576834000, 0, 0],
['2020-04-07', 1.694050524000, 0, 0],
['2020-05-08', 1.651688696000, 0, 0],
['2020-06-05', 1.744380861000, 0, 0],
['2020-07-07', 3.931451572000, 0, 0],
['2020-08-07', 3.970512377000, 0, 0],
['2020-09-08', 1.689529603000, 0, 0],
['2020-10-07', 1.810952882000, 0, 0],
['2020-11-09', 1.805859279000, 0, 0],
['2020-12-07', 1.805452332000, 0, 0],
['2021-01-08', 1.807098881000, 0, 0],
['2021-02-05', 1.590084914000, 0, 0],
['2021-03-05', 1.802181327000, 0, 0],
['2021-04-08', 1.794534613000, 0, 0],
['2021-05-07', 1.781628459000, 0, 0],
['2021-06-08', 1.804448453000, 0, 0],
['2021-07-07', 2.099035552000, 0, 0],
['2021-08-06', 1.893650034000, 0, 0]]
        },

        series: [
            {
                name: 'Rendimentos',
                type: 'bar',
                //barGap: '100%',  // this changed
                //barCategoryGap: '100%', // this changed
                encode: {x:0, y:1 ,tooltip:[0,1]}
            },
            {
                name: 'Amortizações',
                type: 'bar',
                encode: {x:0, y:2 }
            },
            {
                name: 'Extraordinário',
                type: 'bar',
                encode: {x:0, y:3 }
            }
        ]
    }, true);

    // use configuration item and data specified to show chart
    myChart.setOption(option);


    // funções

        function to_BR(data){
            data = parseFloat(data);
            return data.toLocaleString('pt-BR', {style: 'currency', currency: 'BRL'});
        }

<script src="https://mundofii.com/_resources/javaScript/apache-echarts/dist/echarts.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="main" style="width: 100%;height:350px;border: 0px solid red;"></div>

标签： javascriptechartsapache-echarts