CODEWITHSUNDEEP
javascriptecharts
Carlos Isidoro López
Carlos Isidoro López

Reputation: 493

Getting values instead of percentages of dataZoom in Apache Echarts

I am using Apache Echarts, and I have a chart with an X axis of type time, with a dataZoom of type slider. This serves as an example:

var values = [];

for(var i = 0; i < 15; i++) {
    var date = new Date();
    date.setDate(date.getDate() + i);
    values.push([date, i])
}

const firstDate = values[1][0];
const lastDate = values[5][0];

option = {
    xAxis: {
        type: 'time',
        boundaryGap: false,
    },
    yAxis: {
        type: 'value',
    },
    dataZoom: [{
        type: 'slider',
    }],
    series: [
        {
            type: 'line',
            data: values, 
        }
    ]
};

myChart.on('datazoom', (event) => {
    console.log(event)
})

In the event I receive 'start' and 'end' as percentages, but what I would like to receive are the actual start and end date. This means, the values of the axis itself.

I checked the docs, and they say that I can actually get the values when "zoom event of triggered by toolbar". I am not sure whether this refers to the toolbox datazoom (which does not fulfill my needs) or any other thing.

Any help would be appreciated.

Upvotes: 5

Views: 3345

Answers (1)

Augusto Icaro
Augusto Icaro

Reputation: 663

As F.Marks answered here, you should get the values in dataZoom echart`s option property object like the code below:

myChart.on('dataZoom', function() {
  var option = myChart.getOption();
  console.log(option.dataZoom[0].startValue, option.dataZoom[0].endValue);
});

Upvotes: 2

Related Questions