mirror of
https://gitee.com/lvyeyou/DaShuJuZhiDaPingZhanShi.git
synced 2025-06-17 06:55:26 +08:00
794 lines
21 KiB
JavaScript
794 lines
21 KiB
JavaScript
var symptomName = last_month_day();
|
|
|
|
$(function(){
|
|
|
|
|
|
init();
|
|
init2();
|
|
$("#el-dialog").addClass("hide");
|
|
$(".close").click(function(event) {
|
|
$("#el-dialog").addClass("hide");
|
|
});
|
|
|
|
var date = new Date();
|
|
var numble = date.getDate();
|
|
var today = getFormatMonth(new Date());
|
|
$("#date1").html(today);
|
|
$("#date2").html(today);
|
|
$("#date3").html(today);
|
|
$("#date4").html(today);
|
|
|
|
|
|
lay('.demo-input').each(function(){
|
|
laydate.render({
|
|
type: 'month',
|
|
elem: this,
|
|
trigger: 'click',
|
|
theme: '#95d7fb',
|
|
calendar: true,
|
|
showBottom: true,
|
|
done: function () {
|
|
console.log( $("#startDate").val())
|
|
|
|
}
|
|
})
|
|
});
|
|
|
|
})
|
|
function init(){
|
|
//地图
|
|
var mapChart = echarts.init(document.getElementById('mapChart'));
|
|
mapChart.setOption({
|
|
bmap: {
|
|
center: [118.096435,24.485408],
|
|
zoom: 12,
|
|
roam: true,
|
|
|
|
},
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter:function(params, ticket, callback){
|
|
return params.value[2]
|
|
}
|
|
},
|
|
series: [{
|
|
type: 'scatter',
|
|
coordinateSystem: 'bmap',
|
|
data: [
|
|
[118.096435, 24.485408, '厦门市'] ,
|
|
[118.094564, 24.457358, '厦门第一医院'] ,
|
|
[118.104103, 24.477761, '厦门中山医院'],
|
|
[118.14748, 24.506295, '厦门中医院'],
|
|
[118.254841, 24.665349, '厦门第五医院'],
|
|
]
|
|
}]
|
|
});
|
|
mapChart.on('click', function (params) {
|
|
$("#el-dialog").removeClass('hide');
|
|
$("#reportTitle").html(params.value[2]);
|
|
});
|
|
|
|
var bmap = mapChart.getModel().getComponent('bmap').getBMap()
|
|
bmap.addControl(new BMap.MapTypeControl({mapTypes: [BMAP_NORMAL_MAP,BMAP_SATELLITE_MAP ]}));
|
|
bmap.setMapStyle({style:'midnight'})
|
|
|
|
|
|
var pieChart1 = echarts.init(document.getElementById('pieChart1'));
|
|
pieChart1.setOption({
|
|
|
|
color:["#87cefa","#ff7f50","#32cd32","#da70d6",],
|
|
|
|
legend: {
|
|
y : '260',
|
|
x : 'center',
|
|
textStyle : {
|
|
color : '#ffffff',
|
|
|
|
},
|
|
data : ['厦门第一医院','厦门中山医院','厦门中医院','厦门第五医院',],
|
|
},
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}G ({d}%)"
|
|
},
|
|
calculable : false,
|
|
series : [
|
|
{
|
|
name:'采集数据量',
|
|
type:'pie',
|
|
radius : ['40%', '70%'],
|
|
center : ['50%', '45%'],
|
|
itemStyle : {
|
|
normal : {
|
|
label : {
|
|
show : false
|
|
},
|
|
labelLine : {
|
|
show : false
|
|
}
|
|
},
|
|
emphasis : {
|
|
label : {
|
|
show : true,
|
|
position : 'center',
|
|
textStyle : {
|
|
fontSize : '20',
|
|
fontWeight : 'bold'
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data:[
|
|
{value:335, name:'厦门第一医院'},
|
|
{value:310, name:'厦门中山医院'},
|
|
{value:234, name:'厦门中医院'},
|
|
{value:135, name:'厦门第五医院'}
|
|
|
|
]
|
|
}
|
|
]
|
|
});
|
|
|
|
|
|
var lineChart = echarts.init(document.getElementById('lineChart'));
|
|
lineChart.setOption({
|
|
|
|
color:["#87cefa","#ff7f50","#32cd32","#da70d6",],
|
|
legend: {
|
|
y : '260',
|
|
x : 'center',
|
|
textStyle : {
|
|
color : '#ffffff',
|
|
|
|
},
|
|
data : ['厦门第一医院','厦门中山医院','厦门中医院','厦门第五医院',],
|
|
},
|
|
calculable : false,
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}条"
|
|
},
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
axisLine : {onZero: false},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + "k条"
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
}
|
|
],
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data : ['8:00','10:00','12:00','14:00','16:00','18:00','20:00','22:00'],
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
splitLine: {
|
|
"show": false
|
|
},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + ""
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
},
|
|
}
|
|
],
|
|
grid:{
|
|
left: '5%',
|
|
right: '5%',
|
|
bottom: '20%',
|
|
containLabel: true
|
|
},
|
|
series : [
|
|
{
|
|
name:'厦门第一医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[15, 0, 20, 45, 22.1, 25, 70, 55, 76]
|
|
},
|
|
{
|
|
name:'厦门中山医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[25, 10, 30, 55, 32.1, 35, 80, 65, 76]
|
|
},
|
|
{
|
|
name:'厦门中医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[35, 20, 40, 65, 42.1, 45, 90, 75, 96]
|
|
},
|
|
{
|
|
name:'厦门第五医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[45, 30, 50, 75, 52.1, 55, 100, 85, 106]
|
|
}
|
|
]
|
|
});
|
|
|
|
var histogramChart = echarts.init(document.getElementById('histogramChart'));
|
|
histogramChart.setOption({
|
|
|
|
color:["#87cefa","#ff7f50","#32cd32","#da70d6",],
|
|
legend: {
|
|
y : '250',
|
|
x : 'center',
|
|
data:['厦门第一医院', '厦门中山医院','厦门中医院','厦门第五医院'],
|
|
textStyle : {
|
|
color : '#ffffff',
|
|
|
|
}
|
|
},
|
|
|
|
calculable :false,
|
|
|
|
|
|
grid:{
|
|
left: '5%',
|
|
right: '5%',
|
|
bottom: '20%',
|
|
containLabel: true
|
|
},
|
|
|
|
tooltip : {
|
|
trigger: 'axis',
|
|
axisPointer : {
|
|
type : 'shadow'
|
|
}
|
|
},
|
|
|
|
xAxis : [
|
|
{
|
|
type : 'value',
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: {
|
|
color: '#fff'
|
|
}
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
color:['#f2f2f2'],
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
|
|
}
|
|
],
|
|
|
|
yAxis : [
|
|
{
|
|
type : 'category',
|
|
data:['门诊人数(人)', '住院人次(人)','人均费用(元)'],
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: {
|
|
color: '#fff'
|
|
}
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
}
|
|
],
|
|
|
|
series : [
|
|
{
|
|
name:'厦门第一医院',
|
|
type:'bar',
|
|
stack: '总量',
|
|
itemStyle : { normal: {label : {show: true, position: 'insideRight'}}},
|
|
data:[320, 302, 301]
|
|
},
|
|
{
|
|
name:'厦门中山医院',
|
|
type:'bar',
|
|
stack: '总量',
|
|
itemStyle : { normal: {label : {show: true, position: 'insideRight'}}},
|
|
data:[120, 132, 101]
|
|
},
|
|
{
|
|
name:'厦门中医院',
|
|
type:'bar',
|
|
stack: '总量',
|
|
itemStyle : { normal: {label : {show: true, position: 'insideRight'}}},
|
|
data:[220, 182, 191]
|
|
},
|
|
{
|
|
name:'厦门第五医院',
|
|
type:'bar',
|
|
stack: '总量',
|
|
itemStyle : { normal: {label : {show: true, position: 'insideRight'}}},
|
|
data:[150, 212, 201]
|
|
}
|
|
|
|
]
|
|
});
|
|
|
|
var lineChart2 = echarts.init(document.getElementById('lineChart2'));
|
|
lineChart2.setOption({
|
|
|
|
color:["#87cefa","#ff7f50","#32cd32","#da70d6",],
|
|
legend: {
|
|
y : '260',
|
|
x : 'center',
|
|
textStyle : {
|
|
color : '#ffffff',
|
|
|
|
},
|
|
data : ['厦门第一医院','厦门中山医院','厦门中医院','厦门第五医院',],
|
|
},
|
|
calculable : false,
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}条"
|
|
},
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
axisLine : {onZero: false},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + "k条"
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
}
|
|
],
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data : ['8:00','10:00','12:00','14:00','16:00','18:00'],
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
splitLine: {
|
|
"show": false
|
|
},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + ""
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
},
|
|
}
|
|
],
|
|
grid:{
|
|
left: '5%',
|
|
right: '5%',
|
|
bottom: '20%',
|
|
containLabel: true
|
|
},
|
|
series : [
|
|
{
|
|
name:'厦门第一医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[15, 0, 20, 45, 22.1, 25,].reverse()
|
|
},
|
|
{
|
|
name:'厦门中山医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[25, 10, 30, 55, 32.1, 35, ].reverse()
|
|
},
|
|
{
|
|
name:'厦门中医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[35, 20, 40, 65, 42.1, 45, ].reverse()
|
|
},
|
|
{
|
|
name:'厦门第五医院',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[45, 30, 50, 75, 52.1, 55, 6].reverse()
|
|
}
|
|
]
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
function init2(){
|
|
var lineChart3 = echarts.init(document.getElementById('lineChart3'));
|
|
lineChart3.setOption({
|
|
|
|
color:["#87cefa","#ff7f50",],
|
|
legend: {
|
|
y : 'top',
|
|
x : 'center',
|
|
textStyle : {
|
|
color : '#ffffff',
|
|
|
|
},
|
|
data : ['门诊人次','住院人次'],
|
|
},
|
|
calculable : false,
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}人"
|
|
},
|
|
dataZoom: {
|
|
show: true,
|
|
realtime : true,
|
|
start: 0,
|
|
end: 18,
|
|
height: 20,
|
|
backgroundColor: '#f8f8f8',
|
|
dataBackgroundColor: '#e4e4e4',
|
|
fillerColor: '#87cefa',
|
|
handleColor: '#87cefa',
|
|
},
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
axisLine : {onZero: false},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + "人"
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
}
|
|
],
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data : symptomName,
|
|
boundaryGap : false,
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
splitLine: {
|
|
"show": false
|
|
},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + ""
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
},
|
|
}
|
|
],
|
|
grid:{
|
|
left: '5%',
|
|
right: '5%',
|
|
bottom: '20%',
|
|
containLabel: true
|
|
},
|
|
series : [
|
|
{
|
|
name:'门诊费用',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[1150, 180, 2100, 2415, 1212.1, 3125,1510, 810, 2100, 2415, 1122.1, 3215,1510, 801, 2001, 2245, 1232.1, 3245,1520, 830, 2200, 2145, 1223.1, 3225,150, 80, 200, 245, 122.1, 325]
|
|
},
|
|
{
|
|
name:'住院费用',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[2500, 1000, 3000, 5005, 3200.1, 3005, 2500, 1000, 3000, 5005, 3200.1, 3005,2500, 1000, 3000, 5005, 3200.1, 3005,2500, 1000, 3000, 5005, 3200.1, 3005, 2500, 1000, 3000, 5005, 3200.1, 3005,2500, 1000, 3000, 5005, 3200.1, 3005,]
|
|
},
|
|
]
|
|
});
|
|
|
|
|
|
var lineChart4 = echarts.init(document.getElementById('lineChart4'));
|
|
lineChart4.setOption({
|
|
|
|
color:["#87cefa","#ff7f50",],
|
|
calculable : false,
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}元"
|
|
},
|
|
dataZoom: {
|
|
show: true,
|
|
realtime : true,
|
|
start: 0,
|
|
end: 18,
|
|
height: 20,
|
|
backgroundColor: '#f8f8f8',
|
|
dataBackgroundColor: '#e4e4e4',
|
|
fillerColor: '#87cefa',
|
|
handleColor: '#87cefa',
|
|
},
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
axisLine : {onZero: false},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + "元"
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
}
|
|
}
|
|
],
|
|
xAxis: [
|
|
{
|
|
type: 'category',
|
|
data : symptomName,
|
|
boundaryGap : false,
|
|
axisLine:{
|
|
lineStyle:{
|
|
color: '#034c6a'
|
|
},
|
|
},
|
|
splitLine: {
|
|
"show": false
|
|
},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#fff'
|
|
},
|
|
formatter: function (value) {
|
|
return value + ""
|
|
},
|
|
},
|
|
splitLine:{
|
|
lineStyle:{
|
|
width:0,
|
|
type:'solid'
|
|
}
|
|
},
|
|
}
|
|
],
|
|
grid:{
|
|
left: '5%',
|
|
right: '5%',
|
|
bottom: '20%',
|
|
containLabel: true
|
|
},
|
|
series : [
|
|
{
|
|
name:'医疗费用',
|
|
type:'line',
|
|
smooth:true,
|
|
itemStyle: {
|
|
normal: {
|
|
lineStyle: {
|
|
shadowColor : 'rgba(0,0,0,0.4)'
|
|
}
|
|
}
|
|
},
|
|
data:[1500, 800, 1200, 2450, 1122.1, 1325,1150, 180, 1200, 1245, 1122.1, 1325,150, 180, 1200, 2145, 1212.1, 3215,1510, 180, 2100, 2415, 122.1, 325,150, 80, 200, 245, 122.1, 325].reverse()
|
|
},
|
|
]
|
|
});
|
|
|
|
//年龄分布
|
|
var pieChart2 = echarts.init(document.getElementById('pieChart2'));
|
|
pieChart2.setOption({
|
|
color:["#32cd32","#ff7f50","#87cefa","#FD6C88","#4b5cc4","#faff72"],
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}人"
|
|
},
|
|
calculable : true,
|
|
series : [
|
|
{
|
|
name:'发病人数',
|
|
type:'pie',
|
|
radius : [30, 110],
|
|
center : ['50%', '50%'],
|
|
roseType : 'area',
|
|
x: '50%',
|
|
|
|
|
|
|
|
sort : 'ascending',
|
|
data:[
|
|
{value:10, name:'婴儿(1-3岁)'},
|
|
{value:5, name:'少儿(4-10岁)'},
|
|
{value:15, name:'少年(10-18岁)'},
|
|
{value:25, name:'青年(18-45岁)'},
|
|
{value:125, name:'中年(45-60岁)'},
|
|
{value:175, name:'老年(60岁以上)'},
|
|
]
|
|
}
|
|
]
|
|
})
|
|
|
|
//医疗费用组成
|
|
var pieChart3 = echarts.init(document.getElementById('pieChart3'));
|
|
pieChart3.setOption({
|
|
color:["#32cd32","#ff7f50","#87cefa","#FD6C88","#4b5cc4","#faff72"],
|
|
tooltip : {
|
|
trigger: 'item',
|
|
formatter: "{a}<br/>{b}<br/>{c}元"
|
|
},
|
|
calculable : true,
|
|
series : [
|
|
{
|
|
name:'发病人数',
|
|
type:'pie',
|
|
radius : [30, 110],
|
|
center : ['50%', '50%'],
|
|
roseType : 'area',
|
|
x: '50%',
|
|
|
|
|
|
|
|
sort : 'ascending',
|
|
data:[
|
|
{value:10, name:'诊察费用'},
|
|
{value:500, name:'检查费用'},
|
|
{value:150, name:'检验费用'},
|
|
{value:250, name:'西药费用'},
|
|
{value:125, name:'中药费用'},
|
|
{value:1750, name:'手术费用'},
|
|
]
|
|
}
|
|
]
|
|
})
|
|
}
|