I am using extjs and highcharts to develop a wind rose chart. I need to display the data as trapezoids with straight edges, rather than the default display of the segments with arcs as delimiters. Here is an image of what I am trying to do
I have been able to integrate the highcharts object into my application using the wrapper provided by JoeKuan
However I am not seeing in the highcharts documentation how I can configure the polar chart columns into straight edged segments as seen in the image..
Here is a fiddle of the polar chart as it works currently.. Fiddle
Highcharts.chart('container', {
data: {
table: 'freq',
startRow: 1,
endRow: 17,
endColumn: 7
},
chart: {
polar: true,
type: 'column'
},
title: {
text: 'Wind rose for South Shore Met Station, Oregon'
},
subtitle: {
text: 'Source: or.water.usgs.gov'
},
pane: {
size: '85%'
},
legend: {
align: 'right',
verticalAlign: 'top',
y: 100,
layout: 'vertical'
},
xAxis: {
tickmarkPlacement: 'on'
},
yAxis: {
min: 0,
endOnTick: false,
showLastLabel: true,
title: {
text: 'Frequency (%)'
},
labels: {
formatter: function () {
return this.value + '%';
}
},
reversedStacks: false
},
tooltip: {
valueSuffix: '%'
},
plotOptions: {
series: {
stacking: 'normal',
shadow: false,
groupPadding: 0,
pointPlacement: 'on'
}
}
});
All help greatly appreciated
Lisa
You want type: 'area'
to achieve that visualization.
Highcharts.chart('container', {
data: {
table: 'freq',
startRow: 1,
endRow: 17,
endColumn: 7
},
chart: {
polar: true,
type: 'area'
},
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments