日期:2014-05-16 浏览次数:20400 次
???? 通过Google Chart Tools提供的图表功能实现如下:
? 地址如下:
? http://code.google.com/intl/zh-CN/apis/chart/interactive/docs/gallery/gauge.html
?
效果如下图:
代码如下:
<html>?
? <head>?
? ? <script type='text/javascript' src='https://www.google.com/jsapi'></script>?
? ? <script type='text/javascript'>?
? ? ? google.load('visualization', '1', {packages:['gauge']});?
? ? ? google.setOnLoadCallback(drawChart);?
? ? ? function drawChart() {?
? ? ? ? var data = new google.visualization.DataTable();?
? ? ? ? data.addColumn('string', 'Label');?
? ? ? ? data.addColumn('number', 'Value');?
? ? ? ? data.addRows([?
? ? ? ? ? ['Memory', 80],?
? ? ? ? ? ['CPU', 55],?
? ? ? ? ? ['Network', 68]?
? ? ? ? ]);?
?
? ? ? ? var options = {?
? ? ? ? ? width: 400, height: 120<