Open eleruma opened 3 years ago
I try to create a simple LineChart and every time I get this error trying to include a LineChart: TypeError: this.props.series.events is not a function
var chart = <div></div> if (this.state.data){ chart = <Resizable> <ChartContainer timeRange={this.state.data.range()}> <ChartRow height="220"> <YAxis id="temp" label="TEMP" min={this.state.data.min()} max={this.state.data.max()} width="60" type="linear"/> <Charts> <LineChart axis="temp" series={this.state.data} column={["temp"]}/> <LineChart axis="hum" series={this.state.data} column={["hum"]}/> </Charts> <YAxis id="hum" label="HUM" width="80" min={this.state.data.min()} max={this.state.data.max()} type="linear" /> </ChartRow> </ChartContainer> </Resizable> }
I create this.state.data like this:
const resultData = result.map((item) => { return [item.TIMESTAMP*1000, item.TEMP, item.HUM]}); this.setState({ isLoaded: true, data: timeSeries( { name: "sensor_"+this.state.sensorid, columns: ["time", "temp", "hum"], points: resultData }) });
and result variable looks like this:
const result = [ { ID: 1, SENSORID: '1', TIMESTAMP: 1611047447, TEMP: 25, HUM: 50 }, { ID: 2, SENSORID: '1', TIMESTAMP: 1611047448, TEMP: 26, HUM: 50 }, { ID: 3, SENSORID: '1', TIMESTAMP: 1610881200, TEMP: 25, HUM: 50 }, { ID: 4, SENSORID: '1', TIMESTAMP: 1610881200, TEMP: 25, HUM: 50 } ]
Complete error:
Uncaught (in promise) TypeError: this.props.series.events is not a function renderLine LineChart.js:318 wrappedMethod react-hot-loader.development.js:555 renderLines LineChart.js:301 map Underscore renderLines LineChart.js:300 wrappedMethod react-hot-loader.development.js:555 render LineChart.js:408 hotComponentRender react-hot-loader.development.js:592 proxiedRender react-hot-loader.development.js:600 React 13 sqlQuery chart.js:54 promise callback*sqlQuery chart.js:48 wrappedMethod react-hot-loader.development.js:555 componentDidMount chart.js:30 wrappedMethod react-hot-loader.development.js:545 React 7 unstable_runWithPriority scheduler.development.js:255 React 32 js index.js:9 Webpack 7 LineChart.js:318 React 7 sqlQuery chart.js:54 (Asíncrono: promise callback) sqlQuery chart.js:48 wrappedMethod react-hot-loader.development.js:555 componentDidMount chart.js:30 wrappedMethod react-hot-loader.development.js:545 React 7 unstable_runWithPriority scheduler.development.js:255 React 7 dispatchInteractiveEvent self-hosted:1208 React 25 js index.js:9 Webpack 7
I try to create a simple LineChart and every time I get this error trying to include a LineChart: TypeError: this.props.series.events is not a function
I create this.state.data like this:
and result variable looks like this:
Complete error: