I'm using Highcharts for my website. I need legends support with 3d effect. But am unable to get 3d effect with "chart.options3d.enabled: true" and "plotOptions.pie.depth: ´numeric value´". Please suggest
use alpha beta as well in config, without those it won't render as 3d, see fiddle created for you
options3d: {
enabled: true,
alpha: 45,
beta: 0
}
for legends use showInLegend: true
also check highchart's 3D js in included or not Highcharts 3D js
Related
I would like to use Highcharts and I need to pan/zoom outside displayed data.
I need to pan/zoom (on both sides) outside the loaded data to load new data from my database.
What I want to do with Highcharts
Currently I'm using the Plotly graph, but its not handling touch devices (pinch zooming) at all.
thanks,
s.
You can set min and max properties for xAxis:
xAxis: {
ordinal: false,
min: -999,
max: 1999
}
Live demo: http://jsfiddle.net/BlackLabel/rx4ewu7n/
API Reference: https://api.highcharts.com/highstock/xAxis.max
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
Please check this link http://www.highcharts.com/demo/3d-pie.
I am using this 3d charts and facing to issues to place chrome, i.e, safari like data values in centre each of the colour place. How can i do this ?
any idea ? how can place data values in centre ?
You need to adjust the distance property of the datalabels options, however in 3d mode this isn't always successful as demonstrated here: http://jsfiddle.net/robschmuecker/69Mxj/
But if you sacrifice the 3D angle you can get them in the middle : http://jsfiddle.net/robschmuecker/99SFQ/ (without any 3d options)
http://jsfiddle.net/robschmuecker/69Mxj/1/ (with 3d alpha:10)
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
depth: 35,
dataLabels: {
distance: -30,
enabled: true,
format: '{point.name}'
}
}
},
Indeed it looks like a bug with the distance parameter, so I reported it to our developers 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 write 'reversed' for yAxis: reversed: true
yAxis inverted
but the lower part of the chart is not reversed: ScreenShot
please, tell me how reverse the lower part of the chart?
You can specify settings for the navigator.yAxis explicitly,
navigator: {
yAxis: {
reversed: true
}
}
Reverse navigator y axis too | Highchart & Highstock # jsFiddle
I strongly recommend going through the api reference of highstock and its demo site, they have some great documentation and live and running example codes, you should be able to solve most of the simple use cases from these