javascript 谷歌图表仪表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33206108/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Charts Gauge
提问by Carntel
Most charting gauges seem to only support a starting value (min) of 0.
大多数图表仪表似乎只支持 0 的起始值 (min)。
We have a need for the starting value to be the max and end value to be min so that the needle is maxed out for the lowest value.
我们需要将起始值设为最大值，将结束值设为最小值，以便指针达到最小值。
E.g. Think of the gauge as a ranking of top 20 developers the example below you were rated number 3.
例如，将仪表视为前 20 名开发人员的排名，下面的示例将您评为第 3 名。
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Label', 'Value'],
['Rank', 20 - 3]
]);
var options = {
width: 250,
height: 250,
redFrom: 0,
redTo: 10,
yellowFrom: 10,
yellowTo: 15,
greenFrom: 15,
greenTo: 20,
minorTicks: 20,
max: 20,
min: 0,
majorTicks: ['20', '1']
};
var chart = new google.visualization.Gauge(document.getElementById('chart_div'));
chart.draw(data, options);
}<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['gauge']}]}"></script>
<div id="chart_div" style="width: 400px; height: 400px;"></div>But the problem is since the gauge really does not support this I kinda hacked it to work they way I wanted. Everything works great except for 1 thing. You will notice the value says 17 at the bottom because of this hack:
但问题是因为仪表真的不支持这个，所以我有点破解它以按照我想要的方式工作。除了一件事，一切都很好。由于这个 hack，您会注意到底部的值显示为 17：
['Rank', 20-3]
Can I write a line of jquery to replace this value in the svg results?
我可以写一行 jquery 来替换 svg 结果中的这个值吗？
Any help would be appreciated.
任何帮助，将不胜感激。
回答by Milan Rakos
Change options and data:
更改选项和数据：
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Label', 'Value'],
['Rank', 3]
]);
var options = {
width: 250,
height: 250,
redFrom: 20,
redTo: 10,
yellowFrom: 10,
yellowTo: 5,
greenFrom: 5,
greenTo: 0,
minorTicks: 20,
max: 0,
min: 20,
majorTicks: ['20', '1']
};
var chart = new google.visualization.Gauge(document.getElementById('chart_div'));
chart.draw(data, options);
}
