I got problem when try connect nodes in opposite direction, to get loop.
How can i configure line that connects "Alpha","Beta","Gamma" and "Page views" not to break?
Here is my code:
jsfiddle.net/Hideon/n6Lqutch/4/
I want make something like this:
Connecting points backwards is not fully supported in Highcharts sankey series yet.
This problem is reported on Highcharts github: https://github.com/highcharts/highcharts/issues/8218
For now, the workaround is to set right marginBottom and clip to false:
chart: {
marginLeft: 50,
marginRight: 50,
marginBottom: 100
},
series: [{
clip: false,
...
}]
Live demo: http://jsfiddle.net/BlackLabel/t3jLszqy/
API:
https://api.highcharts.com/highcharts/chart.marginBottom
https://api.highcharts.com/highcharts/series.sankey.clip
Related
I need to make somewhat of a grid which is dotted, like on the image here:
How would one go on and do about something like this? I know how to do gridlines full, but I want to have dotted gridlines.
You can use gridLineDashStyle to make dotted gridlines:
xAxis: {
gridLineDashStyle: 'dash',
gridLineWidth: 1
},
More style examples can be found here can be found here: https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/series-dashstyle-all/
Is there any way to show the summation of area charts value in highcharts without using line chart? I would like to know any other alternatives.
You can use area series with stacking: 'normal' and set lineWidth and lineColor for the series at the top.
series: [{
lineWidth: 2,
lineColor: 'red',
...
}, ...]
Live demo: https://jsfiddle.net/BlackLabel/sft7bu8r/
API Reference: https://api.highcharts.com/highcharts/series.area.lineColor
In this example you see that the circle I'am trying to draw doesn't show up correctly, it's not possible to draw anything under the navigator of highstock.
what should I do so I can draw under the navigator ?
renderer.circle(100, 180, 50).attr({
fill: 'red',
stroke: 'black',
'stroke-width': 1,
zIndex: 3
}).add();
If I understand your question now it is that you want to add some drawn elements below the navigator location (not behind). To do this you would need to play with your chart's size (which you are handling in your div it looks like) and then by adding the following:
chart: {
renderTo: 'container',
spacingBottom: 150
},
The spacingBottom (and the other spacing*) options let you format the non-chart chart area spaces.
I did some changes to your jsFiddle to demo one way to accomplish this here.
I have a question about highchart's overlapping data labels. I have 2 spline data series and as you can see here http://jsfiddle.net/3E8V4/ some data labels are overlapping.
Question here is: is this overlapping even possible to prevent? If yes - how should I do it?
Code for plotoptions is like that:
plotOptions: {
spline: {
dataLabels: {
enabled: 'True',
crop: false,
overflow: 'none'
},
enableMouseTracking: false
}
},
You can use that plugin for repositioning dataLabels: http://jsfiddle.net/menXU/1/ It's not perfect, since works only for max 2 series and requires disabled animations, or you will see little delay when repositioning dataLabels.
How to use? Copy StaggerDataLabels and isLabelOnLabel functions, and then use StaggerDataLabels in load and redraw events for chart.
Sobis,
I don't have a answer that is exactly what you are expecting.
In this case what i would do is increase the max of yAxis by 10% of the maxi m of the data.
provide zoom in/out. that will enable the user to get a values on top of the points
zoomType: 'xy'
here is an example http://jsfiddle.net/3E8V4/1/
hope you will find it useful
I have a Highcharts line graph and I'm considering adding dataLabels to each point. According to the API documentation, you can change the vertical placement via verticalAlign, but it doesn't seem to work.
I tried editing the jsfiddle of the basic line graph to include this:
plotOptions: {
line: {
dataLabels: {
enabled: true,
verticalAlign: 'bottom'
},
enableMouseTracking: false
}
},
While the dataLabels are enabled, the vertical position doesn't change regardless of what I put for the verticalAlign value. Anyone had this issue with line graphs?
As Sebastian pointed out in the comment above, verticalAlign does seem to work but it's inverted. Per the head Highcharts developer, this is expected behavior and won't change (includes detailed explanation): https://github.com/highslide-software/highcharts.com/issues/1554