Highcharts multiple dynamic panes with single legend - javascript

I would like to create a highchart with:
-Multiple panes that can be turned on and off to show different data streams (temperature, wind speed, wind direction)
-A single legend for each data stream where you can turn on and off different weather models (NAM, GFS, RAP)
Essentially the user could select, independently of each other, which data streams and which models to show.
To get the idea of what I mean you can see where I am at right now here. I would like there to be one legend, and when you turn off/on a data set all three graphs/panes respond, and also a selector where if you turned off Wind Speed, Wind Direction would slide upward/resize.
Any ideas? I was unable to even figure out how to make panes in highcharts so I understand if this is a pretty noob question.Thanks in advance

In the highcharts you can use multiple axis like here:
http://www.highcharts.com/stock/demo/candlestick-and-volume
http://www.highcharts.com/demo/combo-multi-axes
If you need to show/hide you should destroy / initialize new axis.
Customisation of legendItemClick:
http://api.highcharts.com/highcharts#plotOptions.series.events.legendItemClick

Related

Circle-Packing chart with direction links

I'am trying to create circle-packing chart like that
https://bl.ocks.org/mbostock/4063530
But I also want to create some relation between data, to show how data binds to each other, so I need to add some code to change example above to make it like on this image: Circle chart with relational links
So the question is: is it possible to add relational between children in array to reach desired behavior and change Circle-chart layout to Linked Circle chart layout?
P.S. I'm new in d3.js so I don't have deep knowledge in this field, so It would be great if you provide me some examples how to reach that
I've solved my problem my problem by myself, The solution is that to draw arrows by hands without d3 layout tools, I hope it could be useful for someone:
Circle pack with relation arrows

How to implement two highcharts response related with same trigger

I have a new requirement, that one page contains several highcharts.
And when I move mouse on one highchart, tooltips will be shown, and a guideline also will be shown. Maybe it calls trackball. In the same time, another highchart in this page, will also show its tooltips and guideline(trackball).
Just like this, http://jsfiddle.net/highcharts/nhVbs/,
but this is in one series.
Any one do such job before can give me some advise?
I only got one example for similar work.
http://vikinghammer.com/2012/02/02/connecting-highcharts-and-jqgrid-with-trigger-and-bind/
But not understand how he implement it.
When move the mouse to one line chart, two charts will all show the guidelines and tooltips.
Like this demonstrate.

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

Highcharts/Stockcharts stack series separately

I am looking into trying to stack completely different series/charts on top of each other but on the same chart. For instance I could have two charts stacked vertically and when I move the cross-hair on one, it will move on the other almost as if the charts are linked. As well, I'd when I zoom in one, it would trigger the other to zoom. Please see the image at the bottom I "doctored" to give you an idea of what I'm trying to accomplish.
Things I've tried:
creating two completely separate charts and stacking them.
This is the closest I've gotten to what I need but they are still separate entities so it won't work for what I need, cross-hairs/zooming/etc. all need to work as though the charts are linked/combined.
In the options I tried the "stacking" option.
this won't work because it "stacks" or groups data, I want to literally have two separate series that might not have anything in common with each other.
Rendering muliple y-axis.
the only issue with this is that it's overlapped data, I'd like it to be offset so we can see it in a stacked layout.
I'm pretty new to using this library so if any of my terminology or explanation doesn't sound right, please sound off and I'll elaborate.
Thanks everyone!

How to visualise yes/no data

I don't know where this question goes, if it belongs in math, then someone should move it there.
I have a set of yes/no data (0s and 1s), what possible ways could you visualise this, apart from the normal pie charts and the like.
I want to do this in Javascript (edit: jquery would be easier), using AJAX with PHP.
Radiobuttons or Checkboxes are usually used on webpages to display Yes/No choices. Another option would be to use images like a green check mark to display a positive value and a red cross to display a negative value.
There are many ways to display data. Are you looking to show it as a graph? If so, try google charts API.
Just the binary choice with no other criteria? (time, location, etc.)
A two element bar chart, two shapes (circles?) in different sizes and colors (like a disjoint Venn diagram), or a pie chart immediately comes to mind.

Categories