я работаю с Highcharts паутины графиком в данный момент и хотел, чтобы увидеть, если я могу сделать следующийHighcharts - паутина диаграмма вопросы
- Как увеличить полярные графики? (или это возможно?)
- Как поместить фоновый цвет в каждый сегмент?
я работаю с Highcharts паутины графиком в данный момент и хотел, чтобы увидеть, если я могу сделать следующийHighcharts - паутина диаграмма вопросы
Как увеличить полярные диаграммы? (или возможно?)
Если вы хотите увеличить масштаб, например zoomType
, то нет. zoomType
отключен для полярных карт highcharts-more.js
. От источника:
// Disable certain features on angular and polar axes
chart.inverted = false;
chartOptions.chart.zoomType = null;
Как поместить цвет фона в каждом сегменте?
Вы можете использовать математику и Chart.renderer
для создания и заполнения путей к цвету фона сегментов. Например, вы можете сделать это следующим образом:
var colors = [ "pink", "yellow", "blue", "red", "green", "cyan", "teal", "indigo" ];
var parts = 6;
for(var i = 0; i < parts; i++) {
centerX = chart.plotLeft + chart.yAxis[0].center[0];
centerY = chart.plotTop + chart.yAxis[0].center[1];
axisLength = chart.yAxis[0].height;
angleOffset = -Math.PI/2;
angleSegment = Math.PI/(parts/2);
firstPointX = centerX + (axisLength * Math.cos(angleOffset + (angleSegment * i)));
firstPointY = centerY + (axisLength * Math.sin(angleOffset + (angleSegment * i)));
secondPointX = centerX + (axisLength * Math.cos(angleOffset + (angleSegment * (i+1))));
secondPointY = centerY + (axisLength * Math.sin(angleOffset + (angleSegment * (i+1))));
chart.renderer.path([
'M', centerX, centerY,
'L', firstPointX, firstPointY,
'L', secondPointX, secondPointY,
'Z'
]).attr({
fill: colors[i % colors.length],
'stroke-width': 1,
'opacity': 1
}).add();
}
Как видно из this JSFiddle demonstration. Вам просто нужно сопоставить число категорий с переменной parts
.
благодарит @ondkloss, есть ли другая форма масштабирования? Думаю, я, вероятно, думаю, что мне нужно изменить мин и макс оси ... – ericbae
Это хорошее предложение. Сортировка «фальшивого увеличения», но использование «chart.yAxis [0] .setExtremes (min, max)» - это хоть что-то. –