I have a very large data set that I'd like to craft into a scaling, zoomable, panning graph that goes back over the course of a decade of data. It appears that the best solution for the job is dygraphs vs other options.
I'm not opposed to other options if any meet the requirements of very high interactivity, so if'n you got someth'n else, please share...
Notwithstanding, I have not found a solid example of using dygraphs with Rails 3 and would really appreciate seeing an example of how to tie this into a dataset very quickly or a link to an example.
Initially I just need to throw all of the content out into the graph to see how it works out and for some analysis, so nothing super fancy's needed.
**EDIT: Just found Highstock. Seems to be a perfect match. In that light I'd like to modify my request to perhaps some examples of utilizing Highstock in this context.
I can't point to any tutorials or lessons. I actually had this exact same problem a while ago, trying to do the exact same thing. My answer is that you just have to generate the HTML/dygraphs functions to plot your data.
In case you are still trying to figure this out, I have created rails app that will interactively let the user choose and plot data from any basic database schema, any database. I'm a total RoR noob, but it works pretty well and is made to be generic and dynamic, as well as add checkboxes and linear regressions to each plot. Its not finished, or fully documented yet but you may find it helpful.
I think you can access it this way:
git clone https://bitbucket.org/zachd1_618/rails-stocks.git
or just get in contact with me if you are for some reason really interested.
I've tested it on multiple databases and different schemas, and it easily handles 50k+ points across multiple graphs.
I see that Highstock is nice too, but you shouldn't have any problems in adapting Dygraphs to what you describe. I have not used it with Rails, but have good experiences with it on Django. The approach would be quite similar: Either you serve the dataset in a separate request, or you generate the dataset within the template layer. The latter is probably the slowest.
Related
I know this question has been asked extensively,so now I confused between options. I want to create application which use populate charts on browser. chart should be interactive and it's conventional chart (pie,bar etc). I liked to go to for D3 but it seems I may fall short on time basis to learn that. so I checked on other libraries like google chart,DC,morris,C3,nvd3,ember chart where DC,C3,nvd3 are create on top of D3. google chart may be restricted due to security reasons. so which library should I prefer? should I go for google one if no security measures are there or any alternative are there?please help me out because as I am digging more,more I am getting confused and I am running out of time to create PoCs for this libraries
I would suggest AmChart. I has lot of examples and good documentation. Additionally you can create interactive maps. And you can create chart easily using a chat creating tool. Which is totally cool.
There are really a lot of chart library it's really hard to pick one. And as a beginner i wanted to just make a working chart app not to go deeper so i picked highcharts, it was very easy to understand for me i hope it works for you too.
https://www.highcharts.com/
this is my demo project if it helps, i wanted a dynamic chart too:
https://github.com/Resoguy/atterbergLimitsApp,
http://madrhino.gq/atterbergLimitsApp/
Try to explore this list: https://en.wikipedia.org/wiki/Comparison_of_JavaScript_charting_frameworks
If your project is non-profit, I'd suggest AnyChart because then you'll be able to use it for free. It has a lot of chart types, ways to work with data, customization options, and ready-to-use samples, as well as comprehensive documentation and API reference.
For one of my project I use chart.js. I think is good is easy and is have also good documentation
I'm currently working on a project using sigma.js where I need to show a large number of nodes and edges (~10000 to ~100000 of each one) stored in a JSON file. But the library is getting laggy when I load the JSON, on each refresh and also when it shows me the graph it doesn't space the nodes. I was wondering if someone knows how to represent this kind of dataset fine.
To be honest i am on the same issue if it can helps, i think the book example of Gephi.org tutorial is still the best.
For the moment i am on including sigmaJS from cloudflare but i don't have any proposition for this.
Something like you replace the library with a link to cloudflare like the one used for phaser.io explained in it git repository or even tweenJS use the same way (it's the way of web devs see #indiedev #indiegamedev on twitter, it helps)
<script src="sigma.min.js"></script>
<script src="sigma.parsers.json.min.js"></script>
http://jsfiddle.net/thefailtheory/L45ue3er/
The threejs random particle visualization performs really well with 20K points.
https://threejs.org/examples/#webgl_points_random
Will be a bit of work to repurpose for network display but the upside is you can leverage GPU for rendering.
For my application, I am making a get request of thousands of data points.
When I use charts js to display the data, it takes a long time to render, and I experience lag. I also noticed that the x-axis labels for each data point don't appear properly, so they had to be omitted
I like the sleek design and ui of the graphs, but cannot get it to work well for my use case. Is charts js not meant to be used with large data sets? Is there another library like charts js that can handle large data sets? While also being free?
if you want to handle big data you should use Highcharts
it easy can handle some million data without a big delay
Another option to consider is ZingChart. It is free as a branded version, but renders large amounts of data quickly while still maintaining flexibility in customization. If you are looking for a sleek design and UI, ZingChart allows the user to change just about every size, shape, and color to match your taste.
Full disclosure, I am on the ZingChart team. However, we developed a speed test tool that I think you will find helpful in testing your number of data points, regardless of which library you end up selecting. Note that some of these libraries will use up all your browser memory, so proceed with caution in some cases.
I had the same problem, Charts js seems to be unable to handle large data sets. The best alternative I've found is https://github.com/danvk/dygraphs . Also you could try http://canvasjs.com/ although it is comercial.
Have a look at LightningChart JS... It is made with WebGL. It can render
1 million data points in ~80 ms in line chart
10 million data points in ~800 ms
that is for static data. Those I got from my PC (AMD Ryzen, NVidia GTX1060)
But for scrolling streaming data, the performance is yet more impressive. Dozens of millions of points, with some configurations with Firefox browser, over 100 million points.
There is a chart performance tester application
I work with the team making this chart...
I have to write an application in javascript using the d3 graphics library to display SysML diagrams. I feel like most of this project is within my grasp but I have no idea how to approach one aspect of it.
Since the application will assume nothing about the complexity, size, or nesting of the diagram, hard-coding rules for how to arrange the blocks would be futile. I imagine significant study has gone into this kind of thing before but I am unaware of what it would fall under or where to look.
Also, does anyone know where to find examples of SysML diagrams in XML format? Any help is appreciated!
Since SysML is a UML2 profile, you might find jsUML2 a useful starting point for your attempts. Basically you could use the jsUML2 to draw the SysML diagram and then use the export function to produce the XML. NB: XMI is the standard for interchange between different tools.
I am working on this new project, wich is a new technology for me...
I'm working with Appcelerator Titanium, building this 3d application...
My applications suppose to be something like 3d Canvas...
I mean a ability to add objects to canvas (drag&drop),rotate them (3d),
and most important to rotate the whole Canvas(3d).
From checking the subject came with a lot of Plug-Ins and libraries:
Three.js,WebGl,HTML5 Canvas,CSS3...
The question is-Is anybody have an idea what is the best to use for
this mission?
Thanks!
Three.js makes it super-easy to make primitives and load pre-generated objects (typically from JSON data).
https://github.com/mrdoob/three.js/
Check out the examples at the bottom of the page, and note how little code is necessary to do anything. The only disadvantage is the overhead of a huge library like Three.js, along with the fact that it is still in its infancy and changing slightly by the month. Beyond that, there's not much advice I can give you as I have no idea what kinds of objects you plan to put in this canvas or what the goal if the project is.