qdqtrj
/
dyyj-app


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>ECahrt 示例</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="../../css/mui.min.css">
		<!--App自定义的css-->
		<link rel="stylesheet" type="text/css" href="../../css/app.css" />
		<style>
			.chart {
				height: 200px;
				margin: 0px;
				padding: 0px;
			}
			
			h5 {
				margin-top: 30px;
				font-weight: bold;
			}
			
			h5:first-child {
				margin-top: 15px;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">血糖监测</h1>
			<a id="xyAdd" class="mui-icon mui-pull-right" style="font-size: 16px;padding-top: 14px;" data-url="xyjc.html">新增</a>
		</header>
		<div class="mui-content">
			<div class="mui-content-padded">
				<h5>总计</h5>
				<div class="chart" id="pieChart"></div>
				<h5>走势图</h5>
				<div class="chart" id="lineChart"></div>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../libs/echarts-all.js"></script>
		<script>
			document.getElementById("xyAdd").addEventListener('tap', function() {
				var url = this.getAttribute('data-url');
				mui.openWindow({
					url: url
				});
			});
			var getOption = function(chartType) {
				var chartOption = chartType == 'pie' ? {
					calculable: false,
					series: [{
						name: '访问来源',
						type: 'pie',
						radius: '65%',
						center: ['50%', '50%'],
						data: [{
							value: 53,
							name: '偏高（53%）'
						}, {
							value: 1,
							name: '偏低（1%）'
						}, {
							value: 46,
							name: '正常（46%）'
						}]
					}]
				} : {
					legend: {
						data: ['高血压','高血压','正常']
					},
					grid: {
						x: 35,
						x2:38,
						x3:40,
						y: 30,
						y2:40,
						y3:55
					},
					toolbox: {
						show: false,
						feature: {
							mark: {
								show: true
							},
							dataView: {
								show: true,
								readOnly: false
							},
							magicType: {
								show: true,
								type: ['line', 'bar']
							},
							restore: {
								show: true
							},
							saveAsImage: {
								show: true
							}
						}
					},
					calculable: false,
					xAxis: [{
						type: 'category',
						data: ['9-28', '10-3', '10-10', '10-17', '10-24', '11-1', '11-8', '11-15', '11-23', '11-30', '12-6', '12-13']
					}],
					yAxis: [{
						type: 'value',
						splitArea: {
							show: true
						}
					}],
					series: [{
						name: '高血压',
						type: chartType,
						data: [143.0, 124.9, 137.0, 113.2, 155.6, 126.7, 135.6, 162.2, 132.6, 120.0, 136.4, 153.3]
					},{
						name: '低血压',
						type: chartType,
						data: [43.0, 34.9, 47.0, 33.2, 45.6, 56.7, 55.6, 62.2, 32.6, 40.0, 36.4, 53.3]
					},{
						name: '正常',
						type: chartType,
						data: [83.0, 64.9, 87.0, 63.2, 85.6, 106.7, 105.6, 122.2, 72.6, 90.0, 66.4, 103.3]
					}]
				};
				return chartOption;
			};
			var byId = function(id) {
				return document.getElementById(id);
			};
			var lineChart = echarts.init(byId('lineChart'));
			lineChart.setOption(getOption('line'));
			var pieChart = echarts.init(byId('pieChart'));
			pieChart.setOption(getOption('pie'));
			byId("echarts").addEventListener('tap', function() {
				var url = this.getAttribute('data-url');
				plus.runtime.openURL(url);
			}, false);
		</script>
	</body>

</html>