Using ChartRangeFilter on Timeline Charts

[DCB]

Hello,

I want to use the ChartRangeFilter on my timeline chart, but I get an error saying that "All series on a given axis must be of the same data type." I want to create something similar to this example:  https://jsfiddle.net/nH2XL

I think it may have something to do with the data format I am currently using.

// Chart Columns

const columns = [

  { type: 'string', id: 'Name' }

  { type: 'string', id: 'Resource' }

  { type: 'string', role: 'tooltip' }

  { type: 'string', id: 'style', role: 'style' }

  { type: 'string', id: 'Start' }

  { type: 'string', id: 'End' }

]

Still, even with a more simple data format, the timeline chart gets drawn then immediately disappears soon after.

// Controls Wrapper

  const controls = [{

    controlType: "ChartRangeFilter",

    options: {

      filterColumnIndex: 4,

      ui: {

        chartType: "LineChart",

        chartOptions: {

          chartArea: { width: "100%", height: "50%" },

        },

      },

    },

    controlPosition: "bottom",

    controlWrapperParams: {

      state: {

        range: {

          start: new Date(start),

          end: new Date(end),

        },

      },

    }

  }]