标签：
<HTML>
<HEAD>
<title>系统环境信息</title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<META NAME="Author" CONTENT="mahh">
<META NAME="Description" CONTENT="系统环境信息">
<style type="text/css">
.version{
border-collapse:collapse
}
.version td{
border:1px solid #999999
}
</style>
</HEAD>
<BODY style="background:transparent;">
<div>
<table class="" width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="">
<!-- <div class="unit_content_list"> -->
<div id="main" style="height:400px;border:1px solid #ccc;width:100%">
<!-- 画布 -->
</div>
<!-- </div> -->
</td>
</tr>
</table>
</div>
<script type="text/javascript" src="echarts-plain.js"></script>
<script type="text/javascript" >
var usedMe=200;
var freeMe=300;
var maxUseabledMe=512;
var domCode = document.getElementById('main');
var myChart = echarts.init(domCode);
myChart.setOption({
title : {
text: '内存占用统计',
x:'center'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} ({d}%)"
},
legend: {
orient : 'vertical',
x : 'left',
data:['当前占用内存总数'+usedMe+'MB','当前占用内存剩余'+freeMe+'MB','最大可用内存'+maxUseabledMe+'MB']
},
toolbox: {
show : true,
feature : {
saveAsImage : true
}
},
series : [
{
name:'内存占用统计',
type:'pie',
radius : '145px',
center: ['50%', 200],
selectedMode:'single',
data:[
{value:usedMe, name:'当前占用内存总数'+usedMe+'MB'},
{value:freeMe, name:'当前占用内存剩余'+freeMe+'MB'},
{value:maxUseabledMe, name:'最大可用内存'+maxUseabledMe+'MB'}
]
}
]
});
</script>
</BODY>
</HTML>ECharts，一个javascript 互动图表库，使用例子。
标签：
原文地址：http://blog.csdn.net/asiaasia666/article/details/43853005
