作为 JavaScript 和 Highcharts 的新手，我需要帮助。示例或文档引用将非常有帮助。 因此，我想做的是创建一个包含约 10 个问题的调查，并以单选按钮格式提供"is"、“否”和“两者”等答案。
当用户选择这些答案时，我希望将其绘制成图表，通过环顾四周，我相信 Highcharts 似乎是最简洁易用的库。
我怎样才能做到这一点？
总之，用户选择问题的答案，当他们按下“提交”按钮时，代码应该计算有多少是、否和两者，并绘制一个条形图。
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<script src="http://code.highcharts.com/modules/drilldown.js"></script>
<body>
<form action="first question">
<p>Would you choose an Apple?</p>
<input type="radio" name="Q1" value="yes"> Yes<br>
<input type="radio" name="Q1" value="no"> No<br>
<input type="radio" name="Q1" value="other"> Both
</form>
<form action="second question">
<p>Would you choose a Banana?</p>
<input type="radio" name="Q2" value="yes"> Yes<br>
<input type="radio" name="Q2" value="no"> No<br>
<input type="radio" name="Q2" value="other"> Both
</form>
</body>
<button type = button> Submit </button>
最佳答案
将是、否以及两者存储在 yesCount、noCount、bothCount 中。给出是、否以及两者的单独标识符，以便您可以选择全部并查看有多少个具有选中属性。
$(function () {
$('#container').highcharts({
chart: {
type: 'bar'
},
title: {
text: 'Yes/No'
},
subtitle: {
text: 'Subtitle Here'
},
xAxis: {
categories: ['Votes'],
title: {
text: null
}
},
yAxis: {
min: 0,
labels: {
overflow: 'justify'
}
},
plotOptions: {
bar: {
dataLabels: {
enabled: true
}
}
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'top',
x: -40,
y: 80,
floating: true,
borderWidth: 1,
backgroundColor: ((Highcharts.theme && Highcharts.theme.legendBackgroundColor) || '#FFFFFF'),
shadow: true
},
credits: {
enabled: false
},
series: [{
name: 'Yes',
data: [yesCount]
}, {
name: 'No',
data: [noCount]
},{
name: 'Both',
data: [bothCount]
}]
});
});
关于javascript - Highcharts : How to graph from Radio Button，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34801715/