Search code examples
angularangular11ngx-charts

How can I achieve timeline filter bar chart with NGX charts?

I've been trying to figure out how to achieve the timeline for x-axis for NGX chart like in documentation demo page: https://swimlane.github.io/ngx-charts/#/ngx-charts/timeline-filter-bar-chart-demo

But there isn't anywhere code how it was achieved, like in other ngx charts.

I got the JSON and basics all working:

name: 'Temperature',
      series: [
        { value: 22, name: '2021-06-01 10:45:00+00' },
        { value: 33, name: '2021-06-01 11:14:44+00' },
        { value: 11, name: '2021-06-01 13:45:00+00' }, ... ]

But I don't seem to get anywhere without stackblitz code example like with other chart types and features.

Solution

  • Custom Demo Charts

    The "timeline-filter-bar-chart" is an example for custom chart components that you can create on your own with the help of the library.

    You can find the source code in the framewok's repo.