Highchart with background should be Dots instead of Grid - highcharts

I'm trying to set the background of highchart as Dotted line instead of default Grid .Please help me to set the options to set Dot .

The option you need is probably:
yAxis: {
gridLineDashStyle: 'longdash',
You can use the same option in the xAxis block to format the vertical lines. You can also specify different dash styles. The documentation is here:
http://api.highcharts.com/highcharts#yAxis.gridLineDashStyle
The dash style options are demonstrated here:
http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/

Related

Is it possible that the highchart legends should not be a part of the svg?

I am using the highchart library for displaying the charts.
It displays the chart as an SVG image. The legend part is also a part of the SVG.
In the screenshot, please check the <g class="highcharts-legend" element. It is a part of the SVG.
Is there any possibility that legends should not be a part of the SVG? It should be outside the SVG as an HTML list.
Maybe there is an option in the highchart configurations but I am missing it?
Update:
Using the useHtml option, the text of the legend is now outside the SVG, but the color dots are still inside the SVG.
There is useHTML option for legend, but it will place only text elements outside SVG.
legend: {
useHTML: true,
...
}
You need to create a custom legend if you want to move it fully outside of SVG.
Live demo: http://jsfiddle.net/BlackLabel/rox6dc7a/
API Reference: https://api.highcharts.com/highcharts/legend.useHTML

how to add an color picker control to highchart for changing the color of series by user

find here my doubt: https://jsfiddle.net/rur3wthp/`
Function() for getting the color value from color picker and apply the same to line series dynamically
`
How can I apply the color picker color to the series in the chart.
Thanks in advance I searched all websites I cannot find the clear solution as I m beginner help me out.
Using the series.update() method from highcharts api we can update all the series options. Here we in our case it is color aspect of the series.
you can simply do
chart.series[identifier].update({
color: "#ff0000"
});
Here is a jsfiddle to update 2 different series: https://jsfiddle.net/vh27mcL2/
Here is the api ref for the update method : https://api.highcharts.com/class-reference/Highcharts.Series#update

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/

highcharts legend overlapping

highcharts legend overlapping with the name section of the series.
I have got an url : Issue example.
I want to place the legend text bellow the chart.
Please help.
You need to disable floating parameter or use y parameter (http://api.highcharts.com/highcharts#legend.y) to modify position.

Changing the contents of Highcharts legend

When using Highcharts, is it possible to change the contents of the legend to display something other than the series?
For example, I have a scatter chart with just one series but with many elements, so that the element labels obstruct one another and are illegible:
Would it be possible to use the legend to display the element names instead of the series? (each member in the series has a different color so that it is possible to use the legend in this case)
EDIT:
It turns out there isn't any good way to do this, so I wrote my own custom legend. You can find the code here: http://pastie.org/5115536
I hope you find it useful
Highcharts allows to show data points instead of series name in the in the legend. But, Unfortunately its only for Pie charts type:pie.
There is a default option available for the Pie Chart though undocumented in the API.
legendType: 'point',
If you try to set it for other type of chart, Legend does not gets rendered.

Resources