tijian_tieying/web/dccdc/Views/mbfx/gxbdqfx.cshtml
2025-02-20 12:14:39 +08:00

128 lines
5.1 KiB
Plaintext

@{
ViewBag.Title = "冠心病发病数据按地区分析";
}
<table style="width:100%" class="t1">
<tr>
<td width="100px" class="ltd">开始日期:</td>
<td width="120px" class="rtd"><input id="bdt" /></td>
<td width="100px" class="ltd">结束日期:</td>
<td width="120px" class="rtd"><input id="edt" /></td>
<td class="rtd"><input id="cx" value="查询" type="button" class="l-button" /></td>
</tr>
</table>
<div style="width:800px;float:left;height:250px; background-color: #ffffff;
box-shadow: 0px 4px 12px rgba(34, 25, 25, 0.2);
margin: 0.25rem;
margin-top: 0.5rem;" id="chart"></div>
<div style="clear:both"></div>
<div id="grid"></div>
@section scripts{
<script src="@Url.Content("~/Scripts/echarts.min.js")"></script>
<script src="@Url.Content("~/Scripts/macarons.js")"></script>
<script type="text/javascript">
var echart;
$(function () {
$("#bdt").ligerDateEditor({ width: 100 });
$("#edt").ligerDateEditor({ width: 100 });
echart = echarts.init(document.getElementById("chart"), "macarons");
var sftjoption = {
title: {
text: "冠心病地区发病分析"
}
};
echart.setOption(sftjoption);
$("#grid").ligerGrid({
title: "冠心病地区发病分析",
width: "98%", height: "98%", data: { Rows: [] },
columns: [
{ name: "dqname", display: "地区名称", width: 200, align: "left" },
{ name: "fbrs", display: "发病人数", width: 200, align: "right" }
], usePager: false
});
$("#cx").bind("click", function () {
$.ajax({
url: "@Url.Action("getgxbdqfx")", type: "post", datatType: "json", data: { bdt: $("#bdt").val(), edt: $("#edt").val() }
, success: function (data) {
$.ligerDialog.closeWaitting();
data = $.parseJSON(data);
liger.get("grid").set("data", data);
var x = [];
var y = [];
for (var i = 0; i < data.Rows.length; i++) {
x.push(data.Rows[i].dqname);
y.push(data.Rows[i].fbrs);
}
var op = {
title: {
text: "冠心病地区发病分析",
subtext: $("#bdt").val() + '-' + $('#edt').val()
}
,
tooltip: {
trigger: 'axis'
},
legend: {
data: ['发病人数']
}, toolbox: {
show: true,
feature: {
mark: { show: true },
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ['line', 'bar'] },
restore: { show: true },
saveAsImage: { show: true }
}
},
calculable: true, xAxis: [
{
type: 'category',
data: x
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '发病人数',
type: 'bar',
data: y,
markPoint: {
data: [
{ type: 'max', name: '最大值' },
{ type: 'min', name: '最小值' }
]
},
markLine: {
data: [
{ type: 'average', name: '平均值' }
]
}
}
]
};
echart.setOption(op);
}
, error: function (d) {
$.ligerDialog.closeWaitting();
$.ligerDialog.alert(d.responseText);
}
, beginSend: function () {
$.ligerDialog.waitting("正在分析请稍后……");
}
});
});
});
</script>
}