ECharts refresh on data change

You have to call chartInstance.setOption() again with your new data.

I give you a small example:

// eChart is the chart instance!
echart.setOption({
   // .... some configuration
   series: [
       {
           type: "line",
           name: "test",
           data: [1,2,3,4,5,6]
       }
   ]
})

After you changed the value of your select box, you have to catch that event, change the value of the configuration object and call chartInstance.setOption() again.

Therefore, it is sometimes advisable to save your complete configuration object and store your changes there.

If you are using Angular , You can also use the [merge] option to have the Chart responding for the value changes,

<div echarts [options]="initialValue" [merge]= "dynamicData" class="demo-chart"></div>

Reference : https://github.com/xieziyu/ngx-echarts#api

In your Module assign Initial Value as below,

  initialValue: EChartOption = {
xAxis: {
  type: 'time',
  splitNumber : 20
},
yAxis: {
  type: 'value',
  name : '$',
  nameLocation: 'middle'
},
series: [{
  data : [],
  type: 'line'
}]

}

and set the Dynamic value based on your data, Also initialize "this.dynamicData" before making the api calls to the external service

 formDataforChart(backTestTrades) {
    let i = 0;
    for(let backTestTrade of backTestTrades){
       let profitAndTime = [];
       profitAndTime.push(backTestTrade.exitTime);
       profitAndTime.push(backTestTrade.profitOrLoss);
       this.eChartDataSeries.push(profitAndTime);
    }
    let data = {
      data : this.eChartDataSeries,
      type : 'bar'
    };
    this.dynamicData=this.initialValue;
    this.dynamicData.series = [];
    // Applying my dynamic data here
    this.dynamicData.series.push(data);  
  }

You can use resize() method, for example

window.chartRadar = echarts.init(document.getElementById('echartId'));
window.chartRadar.setOption({
        title: {
            text: 'radar echart'
        },
        tooltip: {},
        legend: {
            data: ['data1', 'data2']
        },
        radar: {
            // shape: 'circle',
            name: {
                textStyle: {
                    color: '#fff',
                    backgroundColor: '#999',
                    borderRadius: 3,
                    padding: [3, 5]
               }
            },
            indicator: [
               { name: 'sales', max: 6500},
               { name: 'Administration', max: 16000},
               { name: 'Information Techology', max: 30000},
               { name: 'Customer Support', max: 38000},
               { name: 'Development', max: 52000},
               { name: 'Marketing', max: 25000}
            ]
        },
        series: [{
            name: 'Budget vs spending',
            type: 'radar',
            // areaStyle: {normal: {}},
            data : [
                {
                    value : [4300, 10000, 28000, 35000, 50000, 19000],
                    name : 'data1'
                },
                 {
                    value : [5000, 14000, 28000, 31000, 42000, 21000],
                    name : 'data2'
                }
            ]
        }]
    });

Once you alreay make you echart you cloud use the method "resize()" for redraw the echar for example

window.chartRadar.resize();