Can not get dataZoom to show up about ngx-echarts HOT 9 OPEN

any ideas
@xieziyu

from ngx-echarts.

@krisklosterman Sorry for the late response, I think you need to ask echarts team about this question.

from ngx-echarts.

echarts team does not have an dataset attribute that is angular bound?

from ngx-echarts.

Just forget about dataset, you can directly set data in options just like the echarts official demo.

from ngx-echarts.

I am using [dataset] to bind an angular variable to the chart. I update that variable and it shows up in the chart.

<div echarts [options]="graphOptions" [dataset]="blxAPI.graph_stats" class="echart"></div>

in the code I update blxAPI.graph_stats as new data comes in with an array of

{ name: DateValueHere, value: [DateValueHere, FloatHere]}

the options variable I use

this.graphOptions = {
      title: {
        text: 'Graph Stats Chart Test'
      },
    legend: {
      data:['Graph Stats']
    },
    "grid": {
      "bottom": 80
    },
    "toolbox": {
      feature: {
          dataZoom: {
              yAxisIndex: 'none'
          }
      }
    },
    "dataZoom": [
      {
        "show": true,
        "realtime": true,
        "start": 65,
        "end": 100
      }
    ],
      xAxis: {
          type : 'time',
      },
      yAxis: {
          type : 'value'
      },
      series : [
        {
          name: 'Graph Stats',
          type: 'line'
        }
      ]
    };

  }

from ngx-echarts.

[dataset] is actually putting your data into series for you.
So try to not use dataset and update your graphOptions whenever blxAPI.graph_stats changes just like below:

// call updateStats where you update blxAPI.graph_stats
updateStats() {
  this.graphOptions = {
    title: {
      text: 'Graph Stats Chart Test'
    },
    legend: {
      data: ['Graph Stats']
    },
    "grid": {
      "bottom": 80
    },
    "toolbox": {
      feature: {
        dataZoom: {
          yAxisIndex: 'none'
        }
      }
    },
    "dataZoom": [
      {
        "show": true,
        "realtime": true,
        "start": 65,
        "end": 100
      }
    ],
    xAxis: {
      type: 'time',
    },
    yAxis: {
      type: 'value'
    },
    series: [
      {
        name: 'Graph Stats',
        type: 'line',
        // here is your data
        data: blxAPI.graph_stats
      }
    ]
  };
}

If you still have the same issue, please ask echarts team for help.

from ngx-echarts.

ok thanks

from ngx-echarts.

I've copied static examples out of the echarts website and datazoom does not work.

If anyone actualy has datazoom working with NGX-ECHARTS, please let me know, but I think is broke or not functional.

from ngx-echarts.

well i used e.g.
dataZoom: [ { type: 'inside', start: 50, end: 100 }, { show: true, type: 'slider', y: '90%', start: 50, end: 100 } ],

on my data, and it worked

from ngx-echarts.