我有以下代码:
网页代码
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>
JavaScript
$(function () {
$('#container').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: 1,//null,
plotShadow: false
},
title: {
text: 'Browser market shares at a specific website, 2014'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.name}</b>: {point.percentage:.1f} %',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
series: [{
type: 'pie',
name: 'Browser share',
data: [
['Firefox', 45.0],
['IE', 26.8],
{
name: 'Chrome',
y: 12.8,
sliced: true,
selected: true
},
]
}]
});
});
这段代码的输出是一个饼图,div 内部的值为 Chrome(15(、IE(31( 和 Firefox(53(。
下面是一组文本框和一个按钮:
Number of Arson: <input type="text" id="arson" name="arson">
Number of Homicide: <input type="text" id="homicide" name="homicide">
Number of Physical Injuries: <input type="text" id="physicalinjuries" name="physicalinjuries">
Number of Carnapping: <input type="text" id="carnapping" name="carnapping">
Number of Ethical Law Violation: <input type="text" id="elv" name="elv">
<input type="submit" id = "chart" value="Submit">
单击按钮时,是否可以传递文本框的值并将其用作图表(PIE(中的自定义百分比(切片(?
我在这里的目标是调用一个 PHP 函数,该函数将使用这个从表名中选择(计数(并将其传递给文本框,然后在按下按钮时将该值发送到 PIE 图表。
$('#chart').on('click', function() {
var value = Number($('#arson').val());
var myChart = $('#container').highcharts();
myChart.series[0].data[0].update(value);
});