How to make color bar above navigator in Highstock? - highcharts

I have chart showing time data. I have two points back in time which I need to "mark" in the chart.
I currently indicate these two by plotlines, but would like to show bar, with let's say green and blue bars showing the timespans (for example -13days from now with blue and -90days -> -13days with red).
I would use plotBands, but I can't specify their height and do not want to have them all over the chart.
Is there some way? I saw something about translating pixels and drawing rectangle, but wasn't able to make it work. Also - I zoom a lot in this chart.

You can use Renderer and add custom shape. In other cases, please attach mockup of your goal.
http://api.highcharts.com/highstock#Renderer

Related

I want to add border radius in stack graph in high charts for some particular data

enter image description here See in the example, when I don't have blue data then border-radius should come on black part in the last case. How I can achieve that??
Add border radius on black part if blue is hidden
The problem here is that setting a borderRadius for a single point is not possible according to Highchart's API. You can only set a borderRadius for the whole series. Splitting your points into several series would work, but I'm not sure if the whole demo still makes sense.
API reference: https://api.highcharts.com/highcharts/series.bar.borderRadius

Highchart fill area only between two series

Here is chart http://jsfiddle.net/erzLp3n9/2/
I need to remove color as this image is seems
this image
I have two different series.
I do not want to use area-stacked and arearange because that two different series is dynamic.
I had try by this http://jsfiddle.net/erzLp3n9/3/ but not working
By using negativeFillColor you can color the area if it is negative, which seems to be the problem with your second example.
See this fiddle.
Where I set plotOptions.area.negativeFillColor.
If you are wondering why they don't look like the same color, it is because the top one is 75% opacity, see Highcharts API.
Could you explain exactly why you do not want to use stacking? This option along with setting color of the second series to transparent gives desired effect.
API Reference:
http://api.highcharts.com/highcharts/plotOptions.series.stacking
Example:
http://jsfiddle.net/xhx34mvg/

Shinobi Charts bar graph Customising

I'm using Shinobi Controls Charts to do this project and i'm having some trouble to find ou how to customise my chart to look as close as possible to this:
Here is what i have so far:
The labels at the bottom are the ones that are represented as [name] in the first chart.
The colores of the bars are ok i know how to change them. My problem resides on the labels on the top of each bar and the grid and background grid.
1) How can i remove the grid and change the graph color to transparant? chart.xAxis.style.gridStripeStyle.showGridStripes = NO; does not remove the grid.
2) The radial series had a callback where i could change the labels position, but after taking a look at all the documentation that comes with the demo i can't find anything to change the position of the axis's labels for a bar graph and add more complexity like an image and 2 or 3 labels to it. Also those boxes have to move along with bars.
Does anyone know how to do this 2 topics?
Thank you in advance for any given help.
EDIT :
I've been able to remove the axis with
axis.style.gridStripeStyle.showGridStripes = NO; // removes the main bar
axis.style.majorGridLineStyle.showMajorGridLines = NO; // removes the grid bars
Regarding your second point, use
- (void)sChart:(ShinobiChart *)chart alterTickMark:(SChartTickMark *)tickMark
beforeAddingToAxis:(SChartAxis *)axis
Regarding your first point use
chart.axis.style.majorGridLineStyle.showMajorGridLines = NO

use image to fill bars in highchart?

Can we use an image pattern to fill the bar of highchart barcharts.?
In this link http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-negative/
the bars are colored as blue,maroon and green but what i am looking for is to fill them with an image which i have.Is it doable?
Borrowing from this question, I've put together a demostration here.
Using one of the original Google doodles:

How to add negative area or background for a specific bar or pie chart in highcharts?

Using highcharts, how would I put a default grey bar under my column charts, for example, like this?
And how would I do something similar for a pie chart (if my data takes up 30% of the chart, show the remaining 70% as light grey or something similar to denote unused space of the pie chart)
For the Pie chart there has been a bit of a back and forth in the highcharts forums. What I would do is get all of your data you need to plot and find out what percentage of the total all of that data is. Then, with the remaining percentage create another data point and set its color to grey.
But you really have to consider what is the total percentage means - without further detail I cannot begin to guess.
As for the first question about "default grey bar under my column charts" it is not clear from that link what you mean. I do not really see what you mean with the charts I have looked at.

Resources