Javascript RubyonRails、Highcharts、图表标签(动态)问题
我正在尝试使用Highcharts和RoR在饼图上正确显示动态标签: 视图:dashboard.html.erbJavascript RubyonRails、Highcharts、图表标签(动态)问题,javascript,ruby-on-rails,ruby,json,highcharts,Javascript,Ruby On Rails,Ruby,Json,Highcharts,我正在尝试使用Highcharts和RoR在饼图上正确显示动态标签: 视图:dashboard.html.erb <script> $(function() { new Highcharts.Chart({ chart: { plotBackgroundColor: "#FFBF00", renderTo: "notes_alt", type: "pie" }, title: { text: "Notes
<script>
$(function() {
new Highcharts.Chart({
chart: {
plotBackgroundColor: "#FFBF00",
renderTo: "notes_alt",
type: "pie"
},
title: {
text: "Notes By Subject Type in Percentage"
},
xAxis: {
backgroundColor: '#FCFFC5',
categories: <%=raw @subject_types.to_json %>,
title: {
text: null
}
},
yAxis: {
title: {
text: "Notes",
plotBackgroundColor: "#FFBF00",
labels: {
overflow: 'justify',
categories: <%=raw @subject_types.to_json %>,
}
},
},
tooltip: {
valueSuffix: <%=raw @subject_types.to_json %>
},
plotOptions: {
pie: {
allowPointSelect: true,
plotBackgroundColor: "#FFBF00",
cursor: 'pointer',
dataLabels: {
enabled: true,
format:'<b>{point.subject_type}</b>: {point.percentage:.1f} %'
},
showInLegend: true
}
},
credits: {
enabled: false
},
series: [{
name: 's',
data: <%= @dataWLabel %>
}]
});
});
</script>
您可以在模型中看到我采用的两种方法
型号(注:rb):
def self.getData
数据=[]
self.subject|u type.每个do|type|
数据正常,问题是您试图在饼图中使用xAxis
和yAxis
。饼图中没有轴;)这意味着一切都应该在点选项中设置,例如:[[name,value],[name,value],…,[name,value]]
。其中姓名
是您的主题类型
。谢谢。我对语法感到困惑-如何将其放入代码中?[,值]??-我应该在这里加上“生的”吗?谢谢。不幸的是,我不是ruby开发人员,所以我不知道细节,但一般来说,你应该组合两个数组,这样你就会有一个数组,其中每个对象都是另一个数组。不过,我可以用JS向您展示如何做到这一点。
def dashboard
@data = Note.getData()
@dataWLabels = Note.getDataWithLabels()
@subjects = Note.subject_types
...
end
def self.getData
data = []
self.subject_types.each do |type|
data << self.type_count(type)
end
data
end
def self.getDataWithLabels
data = Hash.new
self.subject_types.each do |type|
data["a"] = self.type_count(type)
end
data
end
....def self.subject_types
pluck(:subject_type).uniq
end
def self.type_count(type)
where(subject_type: type).count
end