Realtime Example

[paul81]

Is there an example of a realtime chart similar to this: https://apexcharts.com/javascript-chart-demos/line-charts/realtime/ .

I tried calling StateHasChanged() after updating the Items Enumerable but that's probably not the right way.

The JS example calls the method updateSeries but this isn't a method in the ApexChart object.

Thanks for your work on this.

[joadan]

Hi,

Currently the only option is to re-render the chart. Use the method SetRerenderChart(), example here https://apexcharts.github.io/Blazor-ApexCharts/chart-events The details chart is re-render everytime a datapoint is selected.

I'm working on adding more methods, starting with UpdateSeries in order to support the realtime example.

[joadan]

Hi

I have made some progress.. take a look at https://apexcharts.github.io/Blazor-ApexCharts/methods/update-series#realtime A new relase will be available in a couple of days.

[paul81]

That was fast. I had only just cloned the repo to take a look at adding it myself. I'll take a look and test it out.

[joadan]

Fixed in v0.7.0-beta

[christiankasongo]

Hi can I use series to populate data? like this var options = { series: [{ name: 'Net Profit', data: [44, 55, 57, 56, 61, 58, 63, 60, 66] }, { name: 'Revenue', data: [76, 85, 101, 98, 87, 105, 91, 114, 94] }, { name: 'Free Cash Flow', data: [35, 41, 36, 26, 45, 48, 52, 53, 41] }], chart: { type: 'bar', height: 350 }, plotOptions: { bar: { horizontal: false, columnWidth: '55%', endingShape: 'rounded' }, }, dataLabels: { enabled: false }, stroke: { show: true, width: 2, colors: ['transparent'] }, xaxis: { categories: ['Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct'], }, yaxis: { title: { text: '$ (thousands)' } }, fill: { opacity: 1 }, tooltip: { y: { formatter: function (val) { return "$ " + val + " thousands" } } } };

    var chart = new ApexCharts(document.querySelector("#chart"), options);
    chart.render();

but in blazor?

[joadan]

@christiankasongo, this should for sure be possible, have you checked the samples here https://apexcharts.github.io/Blazor-ApexCharts/

If you still have questions it's better that you create new issue rather then comment on an old closed one.

Thank you.

[christiankasongo]

Thank you for fast response. I've read through the documentation and there is nothing on that. All examples are on binding a model to the chart.

Thank you