Hi, A workaround way you may try is to take two series, each of which has one threshold.
var realData = [150, 230, 224, 218, 135, 147, 260]; var max = realData.reduce(function (a, b) { return Math.max(a, b); }, -1); var min = realData.reduce(function (a, b) { return Math.min(a, b); }, max); var yAxisMax = 300; var thretholdHigh = 190; var rateHigh = 1 - thretholdHigh / max; var thretholdLow = 170; var rateLow = (yAxisMax - thretholdLow) / (yAxisMax - min); option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value', max: yAxisMax }, color: 'blue', series: [{ data: realData, type: 'line', areaStyle: { // origin: 'start' color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: 'blue' }, { offset: rateHigh, color: 'blue' }, { offset: rateHigh + 0.001, color: 'transparent' }], } }, z: 10 }, { data: realData, type: 'line', showSymbol: false, // hide data item circle lineStyle: { width: 0 // hide line }, areaStyle: { origin: 'end', color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: 'transparent' }, { offset: rateLow, color: 'transparent' }, { offset: rateLow + 0.001, color: 'red' }], } } }] }; Thanks *Ovilia* On Sat, Feb 20, 2021 at 10:32 PM Диман Иванов <ragemo...@gmail.com> wrote: > Hello Echarts team! > > A few weeks ago, I asked a question about the possibility of combining the > two approaches in working with *VisualMap* and *series-line.areaStyle*. > And your issue bot prompted me this email, where I could remind about > myself) > Please, let me know is it possible to simultaneously implement the two > given examples on the one data set. If not, are there any alternatives? > > > https://github.com/apache/echarts/issues/14167 > > > -- > *Regards, Dmitriy* >