Hacker News Reader

Comment by SwellJoe | Hacker News Reader

I always wonder why live data isn't more of a focus for charting libraries. In this case, it's almost ridiculous that live data (and examples of such) aren't front and center. Isn't the point of doing anything in React the reactive nature of the thing? If it doesn't make the process of having live interactive data easier, building it in react seems like a pointless exercise.

I'm sure it is possible to do live data with this, of course, I just don't see it obviously discussed in any of the examples or docs, and that's a shame. I can't think of any instance where I've looked into charting in the past five years that I didn't want live data and interactivity.

View on HN

Worth a thought -> http://mcfunley.com/whom-the-gods-would-destroy-they-first-g... why you don't see more of this type of stuff. Like other commenters pointed out, "live data" isn't a "charting specific" problem, it's a front-end / back-end problem and having a chart library that updates on new data. D3 and other javascript charting libraries have had the capability for a long long time. It's just that when you get down to it very few people really need "live data".

I already have the data; charting is the missing piece. I use live data daily in my work; so does every other system administrator in the world. top, vmstat, iostat, etc. are all live(ish) data, very useful to have access to, and useful to plug into a GUI. It is not opening a portal to another dimension, or something, it's just looking at the state of a thing as it is right now and printing it out. I'm sure there are many other areas where a live view is valuable in a user interface (stock prices, exchange rates, temperatures, etc.). There are all sorts of metrics that aren't necessarily well-served by live data, but existence of those does not negate the existence of metrics that are useful to have as they happen.

I'm really confused by this comment. Unless I'm missing something about this specific library, if you pass new a new `data` prop to the chart, it will re-render, so live data is the same as any other data. This is true for any react component.

And e.g. it redraws the changed objects with the same animation as the initial data, and doesn't "morph" it somehow to the new position. Which you wouldn't know without trying, and might not be what you want. An example would show that clearly.

I don't know, and I find this rather frustrating. I write a lot of tools to monitor devices in the lab via a web interface and often want to see updates every 10-100 ms. The only library I have found that seems to be up to the task is [Flot](http://www.flotcharts.org/) (and I've looked into a lot of options). My main complaints about it are its reliance on jQuery (which I am not otherwise using) and its lack of recent development (although it seems fairly feature-complete).

> In this case, it's almost ridiculous that live data (and examples of such) aren't front and center.

The liveliness of the data doesn't have much to do with the library itself. The question you should ask yourself is "how do you update data within a chart?"

I have no idea what action you're suggesting I should take. Obviously I've asked myself that question, which is why I brought it up. Is this some sort of hacker koan?

I'm pointing out that very few charting library authors seem to have any interest in providing a clear path for supporting live data (by that, I mean charts that update in realtime when new data arrives). It should theoretically be automatic in a library based on react; updating the data that backs the ViewModel should update the View. But, I don't see any examples of that or mention of that capability in a cursory read of the site, or how it is handled when data is updated (like is it smoothly animated, does it just hop to the new status, or does it not do anything at all, breaking the reactive pattern and making building it for react a pointless exercise?).

http://jsfiddle.net/ancpedz4/1/

Click the word clicker, you will see what happens.

So, a re-draw. That's disappointing.

Thanks for the example! That's really all I'm asking/wishing for here...if the library handles live data, show me how. If it doesn't handle it without a lot of trouble, or in ways that look clunky, I know it's not the right library for my projects. It's nice to be able to rule things out quickly.

The redraw is only problematic because of the stupid animation, right? If you had done the same chart by hand in d3, you'd still be incurring redraws.

Yeah, the animation restarting is awful. Ideally, it'd morph to the new values, or tick by on a timeline, depending on the type of data. The restarting animation is the worst action I can think of, aside from not updating, at all. I didn't see any configuration for that, but, it's probably possible to avoid it relatively trivially.

There are a few charting libraries with explicitly covered live data support; I'm just surprised it's a complete afterthought for a library that uses React (which I've always thought of as being designed explicitly for providing a good abstraction for a "live" View and ViewModel).

D3 - checkout the last "transition / animation" on https://bost.ocks.org/mike/path/

Reply on news.ycombinator.com