We Keep Coding

Comparison of two network graphs

I have two network graphs but placing both of them next to each other is the easiest way to compare if the graphs are small. But as the graph grows, it is making hard for the user to compare the views. I wanted to know the best way to merge two graphs and show the comparison.
In the above picture it can be seen that no of nodes are same but the way they are linked is different.
I would like to know how to present the compared data.
Any ideas about different views to present such comparison using d3.js.

I would suggest not trying to apply force layout or similar method for drawing graphs (that would draw the graph in a fashion similar to the on in the picture in your question). Instead, I wold like to suggest using circular layout for both graphs (similar to chord diagram):
This visual example is made for other purposes, but similar principles could be applied to your problem:
Layout all vertexes on a circle, in equidistant style (if there are some vertices belonging only to one of two graphs, they can be grouped and marked different color)
If there is a link between two vertices in both graphs, connect them in one color (lets say green)
If there is a link between two vertices in one graph only, connect them in appropriate color, dependant on a graph (lets say red and purple)
This method scales well with number of vertices.
Hope this helps.

Following methods for network comparison could be useful in the current scenario:
NetConfer, a web application
Nature Scientific Reports, an article guiding comparisons
CompNet, a GUI tool

KendoUI Dataviz series markers on top of each other

I have been using KendoUI Dataviz for only a short time, and have found I am able to customize it in almost anyway to meet my needs except one. I have two different charts where certain series just happen to have more than one point with the same plots. (dynamic data) I am unable to see all of the tooltips for all of the markers (since they are on top of each other), which means I am also unable to use the seriesClick or seriesHover events on those that are hidden. I have searched Kendo's forums, Stackflow and even Google but can't find anything specifically on the unreachable issue. Kendo's forums mention hiding the tooltip and making a custom one, but I haven't found anything that addressed the fact that some series markers are just unreachable and I need to reach them to use those events. Does anyone have an idea on how I can reach all markers for the series?

I've not been able to figure out a way to show "hidden" data points. I've had to do something similar in the past, and used a custom tooltip template function. In the function I grab the category (x value in my scatter chart sample), and get all matching items from the datasource. Then just put together some sort of list/etc. and return that. You can always go super fancy and make a box with tabs and the whole nine yards to show each dataItem on that particular point.
See sample on jsbin
http://jsbin.com/ONuQUgiY/1/edit

Ways to freeze/Pause Shield UI Chart showing forex data flow?

I am using Shield UI JavaScript Charts to visualize forex data. The charts are being constantly populated with data which is displayed over even intervals of time. However I need to be able to turn off/freeze some of them. The charts themselves have no such functionality, so am looking for some ideas/solutions I can use.

There are two possible scenarios I can think of.
The first one is just to pause the data visualization so that once resumed, the chart having been hidden will have the same points as the others.In order to do so, you may use a checkbox and recreate the chart only if the checkbox is checked/unchecked.
The second scenario involves skipping those data values that have been displayed on the other charts. In order to do so you only need to place the data binding inside the checkbox checked/unchecked clause.Once resumed, the chart having been paused will contain less points compared to the other non-paused charts on your page.

Coloured scatter-plots with javascript

I need a scatterplot like this: http://www.highcharts.com/demo/scatter but, instead of having one color for each serie (male and female, in the example), I need to select the color for each element. Following the example, each person would be coloured with a different level of gray, depending on their age.
As far as I know, Highcharts allow you to select the color of the elements, but it only affects the element pop-up information when you're using scatterplot.
Any other library to do scatterplots? Any way to do it with Highcharts?
Thanks!

You should be able to do this inside Hightcharts using the color property inside the data array.
You can see the documentation here, and there is also an example for this.
You could try preprocessing your data and transform it appending the color information to the array.

I've used AMCharts in a few javascript projects, they include a scatter chart and are quick and very easy to implement.
They have a free version if you are happy with their name in the corner of your chart canvas.
To set the colour of a specific point you can set the color property of a GraphDataItem - as in this documentation http://www.amcharts.com/docs/v.2/javascript_reference/graphdataitem

How does one include sparklines and other per-row graphics in a Google Table (or similar)?

I have a table that makes extensive use of the features in Google Charts' Table Chart, notably, sorting by selected column and color gradients.
I'd like to add a sparkline column. Can anyone suggest methods for doing so? Google Sparkline doesn't appear to be at all integrable.
The only method I've come up with (I haven't tried it) is to create a set of images and set them as the CSS background, one cell at a time. Blecch.
I also have a need to show something like a pie chart or stacked bar per row in a column - something that shows gross proportions of the parts of a whole, with three to five parts. Here also, the Google chart tools don't integrate into Table, AFAICT.
Answers that suggest a different library that doesn't include Google table are fine - as long as the level of effort isn't too much higher, and a similar level of documentation is available.

I agree with Larry K regarding remembering the requirement to store/access the set of numbers that represent the points on your sparkline.
In terms of inserting it to the table, consider the image line charts api. You can easily generate sparkline images once you have the relevant set of numbers for them, and can embed the image url into a table cell, allowing it to render by specifying the allowHtml option in the table chart.
So, just making a cell with <img src='google.com?params=2&whatever=3' /> should do the trick.

You would write your own data formatter to display the sparkline rather than the contents of the cell.
The next issue is to access/store the array of numbers that you want to represent by a sparkline. -- Remember that a Sparkline represents a set of values, it does not represent a single column/value.
There are several ways to solve this problem--eg store the number set as a string; store a key that would be used to look up the number set; or the formatter could use other values in the same row to determine the number set.
Added On second thought, it is not clear if you have access to a generic formatter that can return arbitrary html as the format for the cell's data. I thought you did but perhaps not.