gpt4 book ai didi

angularjs - 带向下钻取的饼图不起作用

转载 作者:行者123 更新时间:2023-12-02 06:17:17 25 4
gpt4 key购买 nike


这是一个笨蛋:
http://plnkr.co/edit/S1B9Q9e1yen0QgmKt2ri

var chartConfig = {
title: {
text: 'Number of offers by trend'
},
subtitle: {
text: 'My company'
},
plotOptions: {
series: {
dataLabels: {
enabled: true,
format: '{point.name}: {point.y:.1f}%'
}
}
},

tooltip: {
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
},
options: {
chart: {
type: 'pie'
},
legend: {
align: 'right',
x: -70,
verticalAlign: 'top',
y: 20,
floating: true,
backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
borderColor: '#CCC',
borderWidth: 1,
shadow: false
},
tooltip: {
headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
},
plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
textShadow: '0 0 3px black, 0 0 3px black'
}
}
}
}
},
series: [{
name: 'Trends',
colorByPoint: true,
data: TREND_LIST
}],
drilldown: {
series: NUMBER_OF_OFFERS_BY_TREND
}
};

馅饼做得很好,但我无法单击以获取向下钻取的馅饼

这是来自 highcharts.com 的原始 fiddle ,我对其进行了一些修改,以便它可以与 highcharts-ng 一起使用:
bit.ly/1kOPi7L

感谢帮助

最佳答案

我终于解决了它(抱歉我不得不回答我自己的问题),感谢 Pawel Fus 的启发性评论:)
首先我添加了下钻模块:

    <script src="http://code.highcharts.com/modules/drilldown.js"></script>

接下来我按照这个答案向 highcharts-ng 库添加了一些代码:
Highcharts-ng with drilldown

最后我把 drilldown 属性放在 option 属性下,如下所述:
https://github.com/pablojim/highcharts-ng/pull/145

这是最终的工作插件:
http://plnkr.co/edit/S1B9Q9e1yen0QgmKt2ri

关于angularjs - 带向下钻取的饼图不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24884635/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com