Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
I saw D3.js and I was interested so I bought this book! I may be wrong, however I found it un-fulfilling.
Does anyone have prime material for mastering D3.jsfor data visualization?
I can see a lot of potential for D3.jsand I am very keen and interested.
thanks in advance!
Update:
I just completed reading Interactive Data Visualization for the Web by Scott Murray, great book! Try it, it's free.
As #Autio already mentioned, there are the tutorials from Scott Murray on his website.
You will also note that on his site, he has a link to his recent d3 book,
Interactive Data Visualization for the Web.
However, that book is now available online for free, along with embedded jsbin examples.
http://chimera.labs.oreilly.com/books/1230000000345/index.html
So if you are looking for a "book", this would be a great start.
Another great place to start is the set of tutorials - you could almost think of them as a mini-book - found here:
http://www.dashingd3js.com/table-of-contents
Part of what is good about these two resources is that they should encourage you to immediately begin playing around with d3 in your browser; so you are actually using d3 and exploring how it works in simple cases, instead of only reading about how it works.
The d3 wiki on github has a good deal of tutorials, and is indispensable for getting a feel for not just d3 but what's going on in the d3 community,
yet I would probably recommend starting with the two links mentioned above,
since they will provide a good base (with a sustained focus,
as opposed to a one or two page post) for then jumping off
into the other tutorials available.
https://github.com/mbostock/d3/wiki/Tutorials
Also, consider what you want to end up doing with d3. By itself, d3 is really powerful yet fairly low-level, meaning: if you just need to make a bar chart instead of a NY Times election map of 512 paths to the White House, then it may be worth looking at a tool like vega that removes some of the low-level complexity that could otherwise be involved in creating an item such as a standard bar chart. And these tools are not few in number, as can be seen in this gist listing libraries that make use of d3.
More recently, Nick Zhu, the author of dc.js charting library that combines d3.js and crossfilter, came out with a new Data Visualization with D3 Cookbook that looks promising and appears to assume a bit more of the reader than does Scott Murray's book.
There's also a d3.js intro for people who are still new to HTML and CSS:
Part1: http://nrecursions.blogspot.in/2014/11/getting-your-head-around-d3js.html
Part2: http://nrecursions.blogspot.in/2014/12/getting-your-head-around-d3js-part2.html
The book you mention is indeed a bit slim. Here are some tutorials I found useful in grasping D3: http://alignedleft.com/tutorials/d3
Really the best method is to explore the source code of the examples hosted by Mike Bostock here: https://github.com/mbostock/d3/wiki/Gallery
I wrote some basic tutorials when I first started to learn, you can find them here:
https://bitbucket.org/hrojas/learn-d3
Related
I've read this question: SproutCore javascript, but as it's four years old, it is outdated. both the frameworks and the linked pages have changed. Apart from that, in four years one could write a lot tutorials. I googled around but couldn't find anything. I've seen the guides on sproutcore.com, but they are far from complete. I can hack together a simple one page interface, but with my current knowledge of the framework, using it would be something more like a handicap than a benefit.
At the moment, the guides and showcase are definitely the best sources of static information. We do realize that the guides are a bit outdated and incomplete and actually have a thread going right now about what needs to be added.
However, the mailing list and IRC are now both very active and picking up steam as we all try to help out and answer questions.
Additionally, we are in the process of getting Sproutcore added to TodoMVC which should give you a good starting point.
If you're interested, we would love to hear your thoughts on what material we can add to the guides to improve! Just visit the guides' GitHub issues page and add an issue for what you'd like to see!
Edit: Also, we are making a push to add some questions to SO so that users can easily find proper examples of how to solve common problems, so definitely check back regularly and view the recent ones.
I apologize for the shameless self-promotion, but some time ago I have assembled a little blog post tracking the most useful learning resources on Sproutcore:
http://unicolet.blogspot.it/2012/04/guide-to-searching-and-finding-help-on.html
Hope you find it useful.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 8 years ago.
Improve this question
I'm sure this question has been asked but it's hard to just google specifically for what i'm looking for.
So, basically I'm already comfortable with OOP and computer science from college material. Now, I'm trying to learn web development and already have the basics of HTML, CSS, and some django (which is what I'm using to make the website).
Now, I know CSS is for kind of designing how the website looks. And javascript can help add animations and extra stuff. Then I've heard so much more stuff like AJAX and javascript (maybe someone could help give me a list of all the tools that are for design: AJAX, javascript, javascript libraries, etc.).
Basically, my main question is this: Anyone have any recommendations for how I should approach learning this material?
(Like, should I try to pick up javascript and learn some of the libraries that are often used? or... maybe I have the wrong idea of what javascript does)
EDIT: So it's been over a year since I've been doing web development at a job. I learned the basics and that post I marked as the answer has defnitely been helpful. But now, I feel like the best way to learn ANYTHING in terms of making a web is to throw your ideas all into your head and then google to understand what tools you can look for and use to materialize those ideas. For example, my post was about "web design and interaction." As a web developer, that's not my job so obviously something like twitter bootstrap helps. But there's also other front-end plugins and tools, it's helped me just to google and look them up to find what I want done. I feel like that's the best way to approach "learning this material"
Check out http://w3schools.com/ they have great tutorials for beginners in the areas you have mentioned and more.
The interactive tutorials on Code Academy are great
HTML/CSS: http://www.codecademy.com/tracks/web
JavaScript: http://www.codecademy.com/tracks/javascript-upgraded
Hope these help.
Good luck getting into Web Development.
For learning Javascript (and a few other languages), I'd suggest Codeacademy.
AJAX is just a way of using JavaScript to load content or changes dyanmically.
jQuery is the most popular JavaScript library, which, if you already know CSS selectors, can be quite easy to get to grips to as they have a very useful api library.
Following web blogs such as Smashing Magazine and CSS-Tricks is very useful, as they offer tips and solutions, and just generally make the web industry exciting.
Edit:
The standard starting points for building a website are:
HTML5 Boilerplate - A great blank starting plate that offers a very optimised blueprint, with lots of fixes of known browser bugs and tips.
Twitter Bootstrap - Similair to HTML5 boilerplate, and most people use a mix of both, this bootstrap is a great way to get a website together quickly, and has options for making it responsive.
It really depends how you find best to learn, personally I like to get all the basics learnt through video tutorials, and then just push myself with my own projects, and just research when I hit a brick wall.
I'd say for a good starting point TutsPlus have some very good tutorials, in particular:
30 days to learn jQuery
PHP Fundamentals
Generally any of their courses to be honest
If you fancy an all-in-one solution - TeamTreehouse are great.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 2 years ago.
The community reviewed whether to reopen this question last year and left it closed:
Original close reason(s) were not resolved
Improve this question
This question is looking for a practical and easy way for drawing multigraphs using Javascript.
First of all look at this question. None of those libraries support Multigraphs (or Pseudographs ). I mean I can't generate graphs like this:
Is there any jQuery plugin (or javascript library) out there for this purpose ?
I thought i can use WolframAlpha's API and use its images, something like this:
but it have lots of problem:
I can't move nodes or add remove edges interactively.
Only 2000 API calls per month. Not enough.
I can't produce large or intermediate graphs.
They are really ugly!
Please help me if you know some javascript library in order to draw Multigraphs, or anyway to produce such graphs (something like Dracula Graph Library but with ability to draw Multigraphs).
Cytoscape.JS supports multigraphs, is pure Javascript, and uses the new HTML 5 Canvas for performance. Its design intent is general purpose graph visualization/manipulation.
https://js.cytoscape.org/
If you are allowed to use Google Charts API you may refer to this
http://code.google.com/apis/chart/image/docs/gallery/graphviz.html
Example:
https://chart.googleapis.com/chart?cht=gv&chl=graph{C_0--H_0[type=s];C_0--H_1[type=s];C_0--H_2[type=s];C_0--C_1[type=s];C_1--H_3[type=s];C_1--H_4[type=s];C_1--H_5[type=s]}
I'm affraid you will have to do some development yourself. Raphael.js is pretty capable in creating and manipulating svg - would be good starting point
Some of those graph visualization libraries (mentioned in this question) DO support Multigraphs and allow dragging/placement of nodes
jsplumb: http://jsplumb.org/jquery/stateMachineDemo.html
possibly http://js-graph-it.sourceforge.net/ may support multigraphs.
but as far as your issue
4- Its really ugly!
These may not appeal to your aesthetic.
I think paper.js (http://paperjs.org) will get you also pretty close.
You might want to check this one out: www.d3js.org
You'd have to do a lot yourself (make your own SVG and such), but the library is very powerful.
I recently used Graphviz to draw the connections between some authors pubblications.
Graphviz is open source graph visualization software. The Graphviz layout programs take descriptions of graphs in a simple text language, and make diagrams in useful formats, such as images and SVG for web pages, PDF or Postscript for inclusion in other documents; or display in an interactive graph browser.
For example i used a simple DOT file to write all the connection between the authors and I produced a PNG file.
http://www.graphviz.org/
Here there is all the documentation that you need and in the gallery section you can see a lot of output example.
Hoping it could be helpful.
In a commercial scenario, take a look at yFiles for HTML:
It easily supports multi-graphs and does not look too ugly, I believe:
(These graphs have been laid out automatically, manual placement is also possible.)
Of course this is a matter of taste, so if you don't like the look, you can change any aspect of the visualization, like in the style tutorial.
The API offers full interactive editing capabilities and being a pure client-side solution, of course there is no API call count limit.
Large graphs are still a problem with todays' Javascript engines, but only if "large" means more than thousands of elements. With virtualization (considering only what is currently visible in the viewport during rendering), you can get good performance with thousands of elements.
Disclaimer: I work for the company that creates the library, on SO/SE, however I do not represent my employer. My posts and comments are my own.
You can check jsnetworkx (http://jsnetworkx.org/)
It is a js version of python graph library which supports multi-graph. It has a draw function which visualizes the graph using D3.js. It is available for both browser and node.js.
Best bet would be to render them on the server (or use it as an applet) with JGraphT.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
I've been working for a few weeks now with the Google Maps API v3, and have done a good bit of development for the map I've been creating.
Some of the things I've done have had to be done to add usability where there previously was not any, at least not that I could find online. Essentially, I made a list of what had to be done, searched all over the web for the ways to do what I needed, and found that some were not(at the time) possible(in the "grab an example off the web" sense).
Thus, in my working on this map, I have created a number of very useful tools, which I would like to share with the development community.
Is there anywhere I could use as a hub, apart from my portfolio ( http://dougglover.com ), to allow people to view and recycle my work?
I know how hard it can be to need to do something, and be unable to find the solution elsewhere, and I don't think that if something has been done before, it should necessarily need to be written again and again. Hence open source code, right?
Firstly, I was considering coming on here and asking a question, and then just answering it. Problem there is I assume that would just look like a big reputation grab. If not, please let me know and I'll go ahead and do that so people here can see it. Other suggestions appreciated.
Some stuff I've made:
A (new and improved) LatLng generator
Works quicker, generates LatLng based on position of a draggable marker
Allows searching for an address to place the marker on/near the desired location(much better than having to scroll to your location all the way from Siberia)
Since it's a draggable marker, double-clicking zooms in, instead of creating a new LatLng marker like the one I was originally using
The ability to create entirely custom "Smart Paths"
Plot LatLng points on the map which connect to each other just like they do using the actual Google Maps
Using Dijkstra's algorithm with Javascript, the routing is intelligent and always gives the shortest possible route, using the points provided
Simple, easy to read multi-dimensional array system allows for easily adding new points to the grid
Any suggestions, etc. appreciated.
GitHub, CodePlex, Google Code, and BitBucket are the obvious choices for open-source hosting. (There's also SourceForge, but ewww, yuck.) Definitely go for a DVCS like git or Mercurial, which will make it easier for others to fork code and contribute back than something like SVN or CVS.
I don't think it's appropriate to use Stack Overflow to post "fake" questions about your project. It would be better to start a blog. If you write good content, people will find you.
On the other hand, I think it is appropriate to look for map-related questions on SO and answer them by saying "I implemented such-and-such algorithm in my BlahBlahBlah project, and you can view the code by clicking this link." Just make sure you are actually answering the questions with specific and relevant information.
You can host your code on SourceForge, github, Codeplex. I am sure there are many more, but those were the ones that came to mind
Thanks for wanting to give back!
GitHub or Google Code would be my first choices, in descending order.
Stay away from SourceForge. Although they are continuously improving, the interface (both for developers and for end users) is horrible, and the entire site is slow as hell.
SourceForge
This one is great for bigger open source apps, written in C, C++, Java ...
github
Here I would post Webapps (like yours).
Codeplex
.Net, JQuery and other Microsoft related stuff should go here. Plus anything you develop with Visual Studio.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
I need to insert a horizontal bar chart in a web page. The thing I have to do is very similar to a Gantt Chart.
I'd like to use a javascript library for the purpose. I tried jsgantt, but actually it is not very beautiful.
I could evaluate also a server generation of the graph. In case my server side language is Python.
It will be part of an internal project with no internet access, so Google Charts isn't an option.
Have a look at the flot jQuery plugin:
Flot is a pure Javascript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side.
The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming and mouse tracking.
The library can produce bar graphs, and is used by our host site - have a look at Stack Overflow Reputation History page.
This is a complete jQuery based Gantt Editor Mit licensed
http://roberto.open-lab.com/2012/08/24/jquery-gantt-editor/
If you want a "complete" review of available ones see here:
http://roberto.open-lab.com/2012/06/14/the-javascript-gantt-odyssey/
I Have recently added SVG based drawing and collapse/expand tree functionality.
See http://roberto.open-lab.com/2014/05/15/jquery-gantt-editor-collapsible-branches/
For me, the best is http://gantter.com/ you don't need registration process, it exports to msproject or pdf.... perfect!
Try one of this:
http://dhtmlx.com/docs/products/dhtmlxGantt/index.shtml - neat chart, option to edit tasks, one serious drawback: lacks timescale change
http://dojotoolkit.org/reference-guide/dojox/gantt.html - free (!!), quite nice, but very hard to customize (unless you modify the source code)
http://bryntum.com/gantt/ - so far, one of my favourites - very easy to customize, but licensing for commercial projects is unclear, you can download trial for 45 days
http://www.tgantt.com/treegrid/www/Gantt.html - actually, this one looks like a space vessel's dashboard and so it is to configure, still struggling to put this in my application
Have a look at http://www.ext-scheduler.com. 100% JavaScript, based on ExtJS. Disclaimer: I wrote it.
JQuery Gantt Chart - the best I tested
I noticed that RadiantQ's jQuery Gantt Chart Package is missing in this discussion. This is relatively new, but has a lot of features, customizable and can be bound to any kind of data. The online demo is here.
For Gantt chart generation see:
http://www.mechanicalcat.net/tech/pytaskplan/
http://www.strout.net/python/piddle/
http://opensched.sourceforge.net/
or there are general charting libs like
http://matplotlib.sourceforge.net/
http://home.gna.org/pychart/
or may be just use gnuplot.
see also Open Flash Chart
it gives support helpers also for the most popular programming languages.
You could use FusionWidget at http://www.fusioncharts.com/widgets/gallery.asp. It's not free, but its Gantt chart works greatly for me.
Maybe you can get some impressions of how it could be done by these examples:
http://www.yuml.me/
http://creately.com/
http://www.chartle.net/
http://www.lovelycharts.com/
http://www.icharts.net/
https://scrumy.com/
http://chartgizmo.com/
http://www.archimy.com/
http://www.gliffy.com/
I hope these are enough for some inspiration.
I like this one, is still under development, "use it at your own risk" but it's very drag and drop
http://ganttapp.appspot.com