esnet / react-timeseries-charts

Declarative and modular timeseries charting components for React
http://software.es.net/react-timeseries-charts
Other
866 stars 284 forks source link

Realtime: Cannot construct Event instances directly #389

Closed hp8wvvvgnj6asjm7 closed 5 years ago

hp8wvvvgnj6asjm7 commented 5 years ago

I follow the example page using pondjs to create a realtime chart


const stream = new Stream();

Pipeline()
    .from(stream)
    .to(EventOut, event => {
        // store the output events in our component state
    });

setInterval(()=>{
  const value = Math.round(Math.random()*100);
  const time = new Date();
  const event = new Event(time, value);
  stream.addEvent(event);
}, 1500);
hp8wvvvgnj6asjm7 commented 5 years ago

Also your example page says:

const time = getNextTime();
const event = new Event(t, value);

What is t? t does not exist.

sartaj10 commented 5 years ago

@hp8wvvvgnj6asjm7 sorry, it's time instead of t

hp8wvvvgnj6asjm7 commented 5 years ago

Thank you, but I really cant even instantiate new Event. . getting errors

hp8wvvvgnj6asjm7 commented 5 years ago

Cannot construct Event instances directly

hp8wvvvgnj6asjm7 commented 5 years ago

Using webpack, maybe an issue with it?

sartaj10 commented 5 years ago

hmm, we've had a few people have issues with webpack in the past but I believe we fixed that. Here's one of the issues - https://github.com/esnet/react-timeseries-charts/issues/233

hp8wvvvgnj6asjm7 commented 5 years ago

No my charts are rendering correctly. I just can't use " new Event "

hp8wvvvgnj6asjm7 commented 5 years ago

import { TimeSeries, Pipeline, Stream, EventOut, Event } from "pondjs";

sartaj10 commented 5 years ago

I'm not being able to recreate the issue. Here's a working example - https://codesandbox.io/s/8nnm2kzl20

Maybe, see what versions of pondjs are you using?

hp8wvvvgnj6asjm7 commented 5 years ago

The non typescript version, which should be compatible with react-timeseries-charts

Your examples are written in a very confusing manner, they say I have to create a new Event( ) but actually i need to choose from another event type inside pondjs.

I already had the suspicion that there was something odd with it.

hp8wvvvgnj6asjm7 commented 5 years ago

Events

To do this, each event is generated semi-randomly, but they could be coming from a real source. We add a new Event for each minute, but emit 5 per second to speed up the simulation. Essentially we do this:

import { Event } from "pondjs";

const value = getRandomValue(); const time = getNextTime();

const event = new Event(t, value); This is declared very literally, like I would have to write it down exactly like that.

hp8wvvvgnj6asjm7 commented 5 years ago

Thanks for clearing this up.