I'm trying to reproduce the Airline on-time performance crossfilter demo in React. We're using Recharts. One feature is the ability to drag a selection window across a bar chart. Is this possible in Recharts?
Looks like there's an example on the Recharts page for line charts. It involves the chart's mouseMove, mouseDown, and mouseUp event handlers.
I think the op is looking for a slider solution something like this on bizcharts its a very common thing to have on charts and think it will be valuable to have something simular on recharts
Related
I am looking to merge bar chart and line chart in the same responsive container in recharts, in a way that they overlay each other. It is possible?
You need Composed Chart from their API and you can decide what chart can overlay another by placing it higher or lower in your code.
I have a pretty basic radar chart and its working as it should.
Now I'm wondering if there is a way to add tooltips that use the default styling but for non-point coordinates, such as the centre position.
I would like to re-use the built in tooltips to benefit from styling and transitions without having to built a custom onHover overwrite.
So I would like to specify x and y coordinates in which the tooltip should show up and then the text that should be displayed. Some kind of callback would work I assume.
I suppose I could add a dataset which has all 0 values and add a custom tooltip to that, but that's not quite exactly what I am trying to achieve here.
Does Chart.js support this? I couldn't find it in the specs nor on stack overflow.
Thanks in advance!
I'm a long-time user of SciChart, but it's an old version (3.1). I've just started using FastHeatMapRenderableSeries for the first time, and there is a requirement for a user to alter the chart's gradient stops. I've implemented a UI to do this (see image), which involves dragging markers that updates their respective gradient stop within the ColorMap's LinearGradientBrush. It's working in as much as gradient changes can be seen in the chart's HeatColorMap (not shown on this screenshot), and also in my "drag" control (a Rectangle whose Fill is bound to the ColorMap's brush).
The problem is that the colours within the chart itself don't change - perhaps I was being a little too hopeful that this would happen automatically! Is this possible, or will I have to recreate the series each time there has been a change to the gradient?
We actually have this working in a later version of SciChart. Im not sure which version exactly but it was introduced at some point. Have a look at this forum post which discusses a bug in the heatmap color map binding in v5.
In the v6 examples suite, you can drag the heat map legend and recolour the chart automatically, so we know in principle this works.
Very cool image by the way!
Do you have any solution on how to add additional functionalities to highcharts bubble chart in react like this one bubble chart?
I need a stoke/circumference around each bubble it has two segments success in white and failure in red those values comes from series data of each point?
I tried some approaches but no luck.
Could you please guide us on how to achieve this?
another requirement is there any option to disable bubbles i.e no hover and select functionalities for particular bubbles
thanks
I tried creating a funnel chart using D3 and vx. This is what i have achieved so far
https://www.webpackbin.com/bins/-L-TDMSWHUS-ZOi0jb8t
But i tried all curve options from d3-shape. But couldn't create the cure as shown in
Any help would be appreciated.
Seems like your best bet would be to make a basic area chart and to reflect it across the x-axis. I believe that would give a similar effect. For more clarification, the x-axis would go through the horizontal center of the chart in the image above