Bläddra i källkod

疾病和死亡详情

zhanghaoyu 6 år sedan
förälder
incheckning
7ba3e7028f

+ 55 - 7
page/bigData/css/alert.css

@ -60,11 +60,11 @@ body {
  font-size: .072917rem;
}
.alert_content .alert_title .right .alert_time input {
  width: 200px;
  width: 1.041667rem;
  height: .135417rem;
  background-color: #051f33;
  border: solid 1px #009dfe;
  margin-left: 15px;
  margin-left: .078125rem;
  padding: 0;
  text-align: center;
  background-image: url("../images/icon_rili1.png");
@ -100,7 +100,7 @@ body {
.alert_chart {
  padding-left: .260417rem;
  padding-right: .260417rem;
  margin-top: .0625rem;
  margin-top: .2025rem;
}
.alert_chart .left {
  height: 2.848958rem;
@ -108,6 +108,31 @@ body {
  background-image: url("../images/quxian-bgi.png");
  background-size: 100% 100%;
}
.alert_chart .left_2 {
  height: 3.057292rem;
  width: 2.15625rem;
}
.alert_chart .left_2 ul {
  width: 199px;
}
.alert_chart .left_2 ul li {
  background-color: #062e5a;
}
.alert_chart .left_2 ul li.title {
  box-shadow: inset 1px 0px 20px 6px #009dfe;
}
.alert_chart .left_2 ul li.title div {
  height: 40px;
  line-height: 40px;
}
.alert_chart .left_2 ul li div {
  height: 45px;
  line-height: 45px;
  text-align: center;
  color: #b5e1fc;
  border: solid 1px #009dfe;
  width: 50%;
}
.alert_chart .right {
  width: 4.583333rem;
}
@ -121,6 +146,16 @@ body {
  width: 3.005208rem;
  background-image: url("../images/right-chart-bgi.png");
}
.alert_chart .right .top .nianling_2 {
  width: 430px;
  height: 256px;
  background-image: url("../images/nianling_2.png");
}
.alert_chart .right .top .xingbie_2 {
  width: 430px;
  height: 256px;
  background-image: url("../images/nianling_2.png");
}
.alert_chart .right .bottom {
  height: 1.380208rem;
  margin-top: .088542rem;
@ -134,10 +169,23 @@ body {
  right: .078125rem;
  z-index: 5;
}
.alert_chart .right .bottom_2 {
  height: 305px;
  margin-top: .088542rem;
  background-image: url("../images/bottom_bgi.png");
  background-size: 100% 100%;
  position: relative;
}
.alert_chart .right .bottom_2 .btn-group {
  position: absolute;
  top: 0;
  right: .078125rem;
  z-index: 5;
}
.alert_content .alert_close {
  width: 50px;
  height: 50px;
  margin: 88px auto 0;
  width: .260417rem;
  height: .260417rem;
  margin: .458333rem auto 0;
  display: block;
}
.laydate-main-list-0 .layui-laydate-content .layui-laydate-list {
@ -175,5 +223,5 @@ body {
  color: #fff!important;
}
.layui-laydate {
  left: 855px !important;
  left: 4.453125rem !important;
}

+ 36 - 5
page/bigData/css/alert.less

@ -35,11 +35,11 @@ body{
    float: right;margin-right: .263958rem;color: #b5e1fc;font-size: .072917rem;
}
.alert_content .alert_title .right .alert_time input{
    width: 200px;
    width: 1.041667rem;
    height: .135417rem;
    background-color: #051f33;
    border: solid 1px #009dfe;
    margin-left: 15px;
    margin-left: .078125rem;
    padding: 0;
    text-align: center;
    background-image: url("../images/icon_rili1.png");
@ -66,10 +66,28 @@ body{
    }
}
.alert_chart{
    padding-left: .260417rem;padding-right: .260417rem;margin-top: .0625rem;
    padding-left: .260417rem;padding-right: .260417rem;margin-top: .2025rem;
    .left{
        height: 2.848958rem;width: 2.15625rem;background-image: url("../images/quxian-bgi.png");background-size: 100% 100%;
    }
    .left_2{
        height: 3.057292rem;width: 2.15625rem;
        ul{
            width: 199px;
            li{
                background-color: #062e5a;
                &.title{
                    box-shadow:inset 1px 0px 20px 6px #009dfe;
                    div{
                        height: 40px;line-height: 40px;
                    }
                }
                div{
                    height: 45px;line-height: 45px;text-align: center;color: #b5e1fc; border: solid 1px #009dfe;width: 50%;
                }
            }
        }
    }
    .right{
        width: 4.583333rem;
        .top{
@ -79,6 +97,12 @@ body{
                    width: 3.005208rem;background-image: url("../images/right-chart-bgi.png");
                }
            }
            .nianling_2{
                width: 430px;height: 256px;background-image: url("../images/nianling_2.png");
            }
            .xingbie_2{
                width: 430px;height: 256px;background-image: url("../images/nianling_2.png");
            }
        }
        .bottom{
            height: 1.380208rem;margin-top: .088542rem;background-image: url("../images/bottom_bgi.png");background-size: 100% 100%;
@ -87,10 +111,17 @@ body{
                position: absolute;top: 0;right: .078125rem;z-index: 5;
            }
        }
        .bottom_2{
            height: 305px;margin-top: .088542rem;background-image: url("../images/bottom_bgi.png");background-size: 100% 100%;
            position: relative;
            .btn-group{
                position: absolute;top: 0;right: .078125rem;z-index: 5;
            }
        }
    }
}
.alert_content .alert_close{
    width: 50px;height: 50px;margin: 88px auto 0;display: block;
    width: .260417rem;height: .260417rem;margin: .458333rem auto 0;display: block;
}
.laydate-main-list-0{
    .layui-laydate-content{
@ -141,5 +172,5 @@ body{
    }
}
.layui-laydate{
    left: 855px!important
    left: 4.453125rem!important
}

+ 112 - 0
page/bigData/html/alert5.html

@ -0,0 +1,112 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link href="../../../css/bootstrap.min.css" rel="stylesheet">
	<link href="../../../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
	<link href="../../../css/plugins/toastr/toastr.min.css" rel="stylesheet">
    <link href="../../../css/style.min.css" rel="stylesheet">
    <link href="../../../css/flex.css" rel="stylesheet">
    <link href="../css/home.css" rel="stylesheet">
    <link href="../css/alert.css" rel="stylesheet">
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
    <div id="main" v-cloak>
        <div class="alert_content">
            <div class="alert_title">
                <div class="left">
                    死亡分析
                </div>
                <div class="right">
                    <div data-toggle="buttons" class="btn-group">
					</div>
                    <div class="alert_time flex f_xy_c">
                        时间
                        <div>
                            <input type="text" class="layui-input" id="time">
                        </div>
                    </div>
                </div>
            </div>
            <div class="alert_people flex f_x_sb f_y_c">
            </div>
            <div class="alert_chart flex f_x_sb">
                <div class="left_2 flex f_x_sb">
                    <ul>
                        <li class="title flex f_x_sb">
                            <div>死亡原因</div>
                            <div>人</div>
                        </li>
                        <li v-for="item in alertChart1" class="flex f_x_sb">
                            <div>{{item.firstColumn}}</div>
                            <div>{{item.HC_15_1006}}</div>
                        </li>
                    </ul>
                    <ul>
                        <li class="title flex f_x_sb">
                            <div>区县</div>
                            <div>人</div>
                        </li>
                        <li v-for="(item,index) in alertChart2" class="flex f_x_sb" v-if = "index > 0">
                            <div>{{item.firstColumn}}</div>
                            <div>{{item.HC_15_1006}}</div>
                        </li>
                    </ul>
                </div>
                <div class="right">
                    <div class="top flex f_x_sb">
                        <div class="nianling_2">
                            <bar-chart :config="alertChart3"></bar-chart>
                        </div>
                        <div class="xingbie_2">
                            <bar-chart :config="alertChart4"></bar-chart>
                        </div>
                    </div>
                    <div class="bottom_2">
                        <div data-toggle="buttons" class="btn-group fr mr20">
                            <!-- <label class="btn btn-default" :class="{active: alertTime == 0}" @click = "alertChart(0)">
								<input type="radio">日
							</label> -->
							<label class="btn btn-default" :class="{active: alertTime == 0}" @click = "alertChart(0)">
								<input type="radio">月
							</label>
							<!-- <label class="btn btn-default" :class="{active: alertTime == 2}" @click = "alertChart(2)">
								<input type="radio">季
							</label> -->
							<label class="btn btn-default" :class="{active: alertTime == 1}" @click = "alertChart(1)">
								<input type="radio">年
							</label>
						</div>
                        <bar-chart :config="alertChart5" ref="_alertChart5"></bar-chart>
                    </div>
                </div>
            </div>
            <div class="alert_close" @click="closeAlertClick"></div>
        </div>
    </div>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1W9gqPiqc7C9TDliPP8S9Rj9"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../../../js/jquery.min.js?v=2.1.4"></script>
    <script src="../../../component/common/event-bus.js"></script>
    <script src="../../../js/plugins/echarts/echarts.js"></script>
    <script src="../../../js/plugins/toastr/toastr.min.js"></script>
    <script src="../../../js/bootstrap.min.js"></script>
    <script src="../../../js/es6-promise.js"></script>
    <script src="../../../js/underscore.js"></script>
    <script src="../../../js/util.js"></script>
    <script src="../../../js/plugins/layer/layer.min.js"></script>
    <script src="../../../js/api/http-request.js"></script>
    <!--<script src="../../../js/api/intelligent-api.js"></script>-->
    <script src="../../../component/chart/bar-chart.js"></script>
    <script src="../component/disease-crowd.js"></script>   
    <script src="../layui/layui.js"></script>
    <script src="../js/alertCharts.js"></script>
    <script src="../js/alert5.js"></script>
</body>
</html>

+ 112 - 0
page/bigData/html/alert6.html

@ -0,0 +1,112 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link href="../../../css/bootstrap.min.css" rel="stylesheet">
	<link href="../../../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
	<link href="../../../css/plugins/toastr/toastr.min.css" rel="stylesheet">
    <link href="../../../css/style.min.css" rel="stylesheet">
    <link href="../../../css/flex.css" rel="stylesheet">
    <link href="../css/home.css" rel="stylesheet">
    <link href="../css/alert.css" rel="stylesheet">
    <link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
    <div id="main" v-cloak>
        <div class="alert_content">
            <div class="alert_title">
                <div class="left">
                    高发疾病分析
                </div>
                <div class="right">
                    <div data-toggle="buttons" class="btn-group">
					</div>
                    <div class="alert_time flex f_xy_c">
                        时间
                        <div>
                            <input type="text" class="layui-input" id="time">
                        </div>
                    </div>
                </div>
            </div>
            <div class="alert_people flex f_x_sb f_y_c">
            </div>
            <div class="alert_chart flex f_x_sb">
                <div class="left_2 flex f_x_sb">
                    <ul>
                        <li class="title flex f_x_sb">
                            <div>疾病</div>
                            <div>人次</div>
                        </li>
                        <li v-for="item in alertChart1" class="flex f_x_sb">
                            <div>{{item.firstColumn}}</div>
                            <div>{{item.HC_15_1006}}</div>
                        </li>
                    </ul>
                    <ul>
                        <li class="title flex f_x_sb">
                            <div>区县</div>
                            <div>人次</div>
                        </li>
                        <li v-for="(item,index) in alertChart2" class="flex f_x_sb" v-if = "index > 0">
                            <div>{{item.firstColumn}}</div>
                            <div>{{item.HC_15_1006}}</div>
                        </li>
                    </ul>
                </div>
                <div class="right">
                    <div class="top flex f_x_sb">
                        <div class="nianling_2">
                            <bar-chart :config="alertChart3"></bar-chart>
                        </div>
                        <div class="xingbie_2">
                            <bar-chart :config="alertChart4"></bar-chart>
                        </div>
                    </div>
                    <div class="bottom_2">
                        <div data-toggle="buttons" class="btn-group fr mr20">
                            <!-- <label class="btn btn-default" :class="{active: alertTime == 0}" @click = "alertChart(0)">
								<input type="radio">日
							</label> -->
							<label class="btn btn-default" :class="{active: alertTime == 0}" @click = "alertChart(0)">
								<input type="radio">月
							</label>
							<!-- <label class="btn btn-default" :class="{active: alertTime == 2}" @click = "alertChart(2)">
								<input type="radio">季
							</label> -->
							<label class="btn btn-default" :class="{active: alertTime == 1}" @click = "alertChart(1)">
								<input type="radio">年
							</label>
						</div>
                        <bar-chart :config="alertChart5" ref="_alertChart5"></bar-chart>
                    </div>
                </div>
            </div>
            <div class="alert_close" @click="closeAlertClick"></div>
        </div>
    </div>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1W9gqPiqc7C9TDliPP8S9Rj9"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/library/MarkerClusterer/1.2/src/MarkerClusterer_min.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../../../js/jquery.min.js?v=2.1.4"></script>
    <script src="../../../component/common/event-bus.js"></script>
    <script src="../../../js/plugins/echarts/echarts.js"></script>
    <script src="../../../js/plugins/toastr/toastr.min.js"></script>
    <script src="../../../js/bootstrap.min.js"></script>
    <script src="../../../js/es6-promise.js"></script>
    <script src="../../../js/underscore.js"></script>
    <script src="../../../js/util.js"></script>
    <script src="../../../js/plugins/layer/layer.min.js"></script>
    <script src="../../../js/api/http-request.js"></script>
    <!--<script src="../../../js/api/intelligent-api.js"></script>-->
    <script src="../../../component/chart/bar-chart.js"></script>
    <script src="../component/disease-crowd.js"></script>   
    <script src="../layui/layui.js"></script>
    <script src="../js/alertCharts.js"></script>
    <script src="../js/alert6.js"></script>
</body>
</html>

BIN
page/bigData/images/nianling_2.png


+ 6 - 0
page/bigData/js/alert1.js

@ -66,10 +66,16 @@ new Vue({
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }

+ 6 - 0
page/bigData/js/alert2.js

@ -66,10 +66,16 @@ new Vue({
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }

+ 6 - 0
page/bigData/js/alert3.js

@ -65,10 +65,16 @@ new Vue({
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }

+ 7 - 0
page/bigData/js/alert4.js

@ -65,10 +65,16 @@ new Vue({
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }
@ -105,6 +111,7 @@ new Vue({
            ]
            httpRequest.getReqPromises(reqUrl).then(function(datas) {
                console.log(datas);
                debugger
                vm.alertData1 = datas[0].obj.VIEW_15_0001[0].HC_15_1006;
                vm.alertData2 = datas[1].obj.VIEW_15_0001[0].HC_15_1006;
                vm.alertData3 = datas[2].obj.VIEW_15_0002[0].HC_15_1003;

+ 360 - 0
page/bigData/js/alert5.js

@ -0,0 +1,360 @@
new Vue({
	el: '#main',
	data: {     
        alertChart1:'',//左边第一块表格
        alertChart2:'',//左边第二块表格
        alertChart3:'',//右上第一块
        alertChart4:'',//右上第二块
        alertChart5:'',//右下
        bigData:'',//总数据
        alertType:0,
        alertTime:0,
        firstDay: "", //上月第一天
        lastDay: "", //上月最后一天
        firstMonth:'',
        lastMonth:'',
        code:[
            'VIEW_13_0018',//死亡原因-人
            'VIEW_13_0019',//区县分布-人
            'VIEW_13_0020',//年龄段分布
            'VIEW_13_0021',//性别分布
            'VIEW_13_0023',//新增患者月趋势
            'VIEW_13_0025',//新增患者年趋势
        ],
        qushiMonth:'',
        qushiYear:'',
        firstDayYear: "", //本年第一天
		lastDayYear: "", //本年最后一天
		halfYearStartDate: "", //近半年开始时间
		halfYearEndDate: "", //近半年结束时间
        yesterdayDate:"",//昨天
        type:0
	},
	mounted: function() {
        var vm = this;
        this.formatDate2017();
        this.initData(this.type);
        var myDate = new Date();
        var maxMonth = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
        var maxYear = myDate.getFullYear();
        var max = maxYear.toString()+'-'+maxMonth.toString();
        console.log(vm.firstMonth,vm.lastMonth)
        var moren = vm.firstMonth+' 至 '+vm.lastMonth;
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
              elem: '#time', //指定元素,
              type:'month',
              range: '至', //或 range: '~' 来自定义分割字符
              theme: '#05273e',
              position: 'abolute',
              right:'200px',
              value: moren,
              max:max,
              btns: ['confirm'],
              done: function(value, date, endDate){
                console.log(value); //得到日期生成的值,如:2017-08-18
                console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
                console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }
            //   showBottom: false
            });
        });
        
    },
    methods: {
        initData:function(type){
            var vm = this;
            var linkageFilter1 = "quotaDate >= '" + vm.firstDay + "' and quotaDate <= '" + vm.lastDay + "';";
            var linkageFilter3 = "quotaDate >= '" + vm.halfYearStartDate + "' and quotaDate <= '" + vm.halfYearEndDate + "';";
            console.log(linkageFilter1)
            var code = this.code;
            var urlNumber = '/gov/report/getNoChartTemplateData';
            var urlChart = '/gov/report/getTemplateDataByViewCode';
            var reqUrl = [
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[0],linkageFilter:linkageFilter1}},//死亡原因-人
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[1],linkageFilter:linkageFilter1}},//区县分布-人
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[2],linkageFilter:linkageFilter1}},//年龄段分布
                {url:urlChart,reqType: 'get',data: {viewCode:code[3],linkageFilter:linkageFilter1}},//性别分布
                {url:urlChart,reqType: 'get',data: {viewCode:code[4],linkageFilter:linkageFilter3}},//新增患者月趋势
                {url:urlChart,reqType: 'get',data: {viewCode:code[5]}},//老年人就诊趋势-年
            ]
            httpRequest.getReqPromises(reqUrl).then(function(datas) {
                console.log(datas);
                vm.alertChart1 = datas[0].obj.VIEW_13_0018;
                vm.alertChart2 = datas[1].obj.VIEW_13_0019;
                // vm.alertData3 = datas[2].obj.VIEW_15_0002[0].HC_15_1003;
                // vm.alertData4 = datas[2].obj.VIEW_15_0002[0].HC_15_1004;
                var chart1 = datas[2].obj.viewInfos[0].options[0].option;
                var chart2 = datas[3].obj.viewInfos[0].options[0].option;
                var chart3 = datas[4].obj.viewInfos[0].options[0].option;
                var chart4 = datas[5].obj.viewInfos[0].options[0].option;
                // var chart5 = datas[7].obj.viewInfos[0].options[0].option;
                vm.qushiMonth = chart3;
                vm.qushiYear = chart4;
                vm.setAlertChart2(chart1);
                vm.setAlertChart3(chart2);
                // vm.setAlertChart4(chart3);
                vm.setAlertChart5(chart3);
            })
        },
        setAlertChart1:function(data){
            var options = JSON.parse(data);
            options = quxianChart(options);
            // var options = this.bigData[t]['区县分布'];
            // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
            this.alertChart1 = options;
        },
        setAlertChart2:function(data){
            var options = JSON.parse(data);
            options = nianlingChart(options);
            options.color = ["#6576e0","#03fa6c","#ff616f","#0fa5f2","#00e6f3"];
            options.legend.formatter = function(name) {
                var index = 0;
                var clientlabels = options.legend.data;
                var clientcounts = _.map(options.series[0].data,function(item,idx){
                	return item.value;
                });
                clientlabels.forEach(function(value,i){
                    if(value == name){
                        index = i;
                    }
                });
                return name + "  " + clientcounts[index];
            }
            options.legend.left = '48%';
            options.legend.top = 0.044 * window.screen.width;//85;
            options.legend.itemWidth = 0.005 * window.screen.width;//10;
            options.legend.itemHeight = 0.005 * window.screen.width;//10;
            options.legend.itemGap = 0.0078 * window.screen.width;//15;
            options.series[0].center = ['25%','55%'];
            this.alertChart3 = options
        },
        setAlertChart3:function(data){
            var options = JSON.parse(data);
            options = xingbieChart(options);
            options.color = ["#00E7F3","#ff616f"];
            options.legend.formatter = function(name) {
                var index = 0;
                var clientlabels = options.legend.data;
                var clientcounts = _.map(options.series[0].data,function(item,idx){
                	return item.value;
                });
                clientlabels.forEach(function(value,i){
                    if(value == name){
                        index = i;
                    }
                });
                return name + "  " + clientcounts[index];
            }
            options.legend.left = '48%';
            options.legend.top = 0.0625 * window.screen.width;//120
            options.legend.itemWidth = 0.005 * window.screen.width;//10;
            options.legend.itemHeight = 0.005 * window.screen.width;//10;
            options.legend.itemGap = 0.0078 * window.screen.width;//15;
            options.series[0].center = ['25%','55%'];
            this.alertChart4 = options
        },
        setAlertChart4:function(data){
            var options = JSON.parse(data);
            options = jibingTopChart(options);
            options.series[0].label = {show: true,position: "right",color: '#b5e1fc'};
            options.series[0].itemStyle.normal.color = '#FFF71A';
            this.alertChart4 = options
        },
        setAlertChart5:function(data){
            var options = JSON.parse(data);
            options = qushiChart(options);
            // var options = this.bigData[t]['区县分布'];
            // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
            this.alertChart5 = options;
            window.chart5 = this.$refs._alertChart5.chart
        },
        alertTitle:function(type){
            this.alertTime = 0;
            this.type = type;
            this.initData(type)
        },
        alertChart:function(time){
            var vm = this;
            this.alertTime = time;
            if(time == 0){
                vm.setAlertChart5(vm.qushiMonth);
            }else if(time == 1){
                vm.setAlertChart5(vm.qushiYear);
            }
        },
        closeAlertClick:function(){
        	parent.layer.closeAll();
        },
        GetQueryString :function (name){
            var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if(r!=null)return  unescape(r[2]); return null;
        },
        chartArea:function(param){
            console.log(param);
        },
        clickBarItem:function(item){
        	console.log(item)
        },
		formatDate: function() {
			//获取上个月第一天
			var firstdate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1);
			//获取上个月最后一天
			var date = new Date();
			var day = new Date(date.getFullYear(), date.getMonth(), 0).getDate();
			var enddate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, day);
			//获取本年第一天和最后一天
			var firstYearDate = new Date();
			firstYearDate.setDate(1);
			firstYearMonty = firstYearDate.setMonth(0);
			//近半年开始时间
			var date1 = new Date();
			date1.setMonth(date1.getMonth() - 6);
			var year1 = date1.getFullYear() - 1;
			var month1 = date1.getMonth() + 1;
			month1 = (month1 < 10 ? "0" + month1 : month1);
			//格式化结果
            this.firstDay = firstdate.format("yyyy-MM-dd");
            this.firstMonth = firstdate.format("yyyy-MM");
            this.lastDay = enddate.format("yyyy-MM-dd");
            this.lastMonth = enddate.format("yyyy-MM");
            this.firstDayYear = firstYearDate.format("yyyy-MM-dd");
			this.lastDayYear = (new Date().getFullYear()-1) + "-12-31";
			this.halfYearStartDate = year1.toString() + '-' + month1.toString() + "-01";
			this.halfYearEndDate = this.getCurrentMonthLast2017();
			this.yesterdayDate = this.getYesterday2017(-1, '-');
        },
		getCurrentMonthLast: function() {
			var date = new Date();
			var currentMonth = date.getMonth();
			var nextMonth = ++currentMonth;
			var nextMonthFirstDay = new Date(date.getFullYear(), nextMonth-1, 1);
			var oneDay = 1000 * 60 * 60 * 24;
			return(new Date(nextMonthFirstDay - oneDay)).format("yyyy-MM-dd");
		},
		getYesterday:function(num, str){
			var today = new Date();
		    var nowTime = today.getTime();
		    var ms = 24*3600*1000*num;
		    today.setTime(parseInt(nowTime + ms));
		    var oYear = today.getFullYear();
		    var oMoth = (today.getMonth() + 1).toString();
		    if (oMoth.length <= 1) oMoth = '0' + oMoth;
		    var oDay = today.getDate().toString();
		    if (oDay.length <= 1) oDay = '0' + oDay;
		    return oYear + str + oMoth + str + oDay;
		},
        formatDate2017: function() {
			//获取上个月第一天
			var firstdate = new Date(new Date().getFullYear()-1, new Date().getMonth() - 1, 1);
			//获取上个月最后一天
			var date = new Date();
			var day = new Date(date.getFullYear()-1, date.getMonth(), 0).getDate();
			var enddate = new Date(new Date().getFullYear()-1, new Date().getMonth() - 1, day);
			//获取本年第一天和最后一天
			var firstYearDate = new Date();
			firstYearDate.setFullYear(new Date().getFullYear()-1)
			firstYearDate.setDate(1);
			firstYearMonty = firstYearDate.setMonth(0);
			//近半年开始时间
			var date1 = new Date();
			date1.setMonth(date1.getMonth() - 6);
			var year1 = date1.getFullYear() - 1;
			var month1 = date1.getMonth() + 1;
			month1 = (month1 < 10 ? "0" + month1 : month1);
			//格式化结果
            this.firstDay = firstdate.format("yyyy-MM-dd");
            this.firstMonth = firstdate.format("yyyy-MM");
            this.lastDay = enddate.format("yyyy-MM-dd");
            this.lastMonth = enddate.format("yyyy-MM");
			this.firstDayYear = firstYearDate.format("yyyy-MM-dd");
			this.lastDayYear = (new Date().getFullYear()-1) + "-12-31";
			this.halfYearStartDate = year1.toString() + '-' + month1.toString() + "-01";
			this.halfYearEndDate = this.getCurrentMonthLast2017();
			this.yesterdayDate = this.getYesterday2017(-1, '-');
        },
		getYesterday2017:function(num, str){
			var today = new Date();
		    var nowTime = today.getTime();
		    var ms = 24*3600*1000*num;
		    today.setTime(parseInt(nowTime + ms));
		    var oYear = today.getFullYear()-1;
		    var oMoth = (today.getMonth() + 1).toString();
		    if (oMoth.length <= 1) oMoth = '0' + oMoth;
		    var oDay = today.getDate().toString();
		    if (oDay.length <= 1) oDay = '0' + oDay;
		    return oYear + str + oMoth + str + oDay;
		},
		getCurrentMonthLast2017: function() {
			var date = new Date();
			var currentMonth = date.getMonth();
			var nextMonth = ++currentMonth;
			var nextMonthFirstDay = new Date(date.getFullYear() - 1, nextMonth-1, 1);
			var oneDay = 1000 * 60 * 60 * 24;
			return(new Date(nextMonthFirstDay - oneDay)).format("yyyy-MM-dd");
        },
        getLastDay(year, month) {
            var new_year = year; //取当前的年份
            var new_month = month++; //取下一个月的第一天,方便计算(最后一天不固定)
            if (month > 12) {
              //如果当前大于12月,则年份转到下一年
              new_month -= 12; //月份减
              new_year++; //年份增
            }
            var new_date = new Date(new_year, new_month, 1); //取当年当月中的第一天
            return new Date(new_date.getTime() - 1000 * 60 * 60 * 24).getDate(); //获取当月最后一天日期
        },
    
    }
});
//数字格式化
function toThousands(str) {
    if(!str)return
    str  =parseInt(str);
    if(typeof(str) == 'number')str = str.toString()
	var newStr = "";
	var count = 0;
	if(str.indexOf(".") == -1) {
		for(var i = str.length - 1; i >= 0; i--) {
			if(count % 3 == 0 && count != 0) {
				newStr = str.charAt(i) + "," + newStr;
			} else {
				newStr = str.charAt(i) + newStr;
			}
			count++;
		}
		str = newStr;
	} else {
		for(var i = str.indexOf(".") - 1; i >= 0; i--) {
			if(count % 3 == 0 && count != 0) {
				newStr = str.charAt(i) + "," + newStr;
			} else {
				newStr = str.charAt(i) + newStr; //逐个字符相接起来
			}
			count++;
		}
		str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
	}
	return str;
}

+ 360 - 0
page/bigData/js/alert6.js

@ -0,0 +1,360 @@
new Vue({
	el: '#main',
	data: {     
        alertChart1:'',//左边第一块表格
        alertChart2:'',//左边第二块表格
        alertChart3:'',//右上第一块
        alertChart4:'',//右上第二块
        alertChart5:'',//右下
        bigData:'',//总数据
        alertType:0,
        alertTime:0,
        firstDay: "", //上月第一天
        lastDay: "", //上月最后一天
        firstMonth:'',
        lastMonth:'',
        code:[
            'VIEW_13_0038',//死亡原因-人
            'VIEW_13_0039',//区县分布-人
            'VIEW_13_0040',//年龄段分布
            'VIEW_13_0041',//性别分布
            'VIEW_13_0042',//新增患者月趋势
            'VIEW_13_0043',//新增患者年趋势
        ],
        qushiMonth:'',
        qushiYear:'',
        firstDayYear: "", //本年第一天
		lastDayYear: "", //本年最后一天
		halfYearStartDate: "", //近半年开始时间
		halfYearEndDate: "", //近半年结束时间
        yesterdayDate:"",//昨天
        type:0
	},
	mounted: function() {
        var vm = this;
        this.formatDate2017();
        this.initData(this.type);
        var myDate = new Date();
        var maxMonth = myDate.getMonth()+1; //获取当前月份(0-11,0代表1月)
        var maxYear = myDate.getFullYear();
        var max = maxYear.toString()+'-'+maxMonth.toString();
        console.log(vm.firstMonth,vm.lastMonth)
        var moren = vm.firstMonth+' 至 '+vm.lastMonth;
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            //执行一个laydate实例
            laydate.render({
              elem: '#time', //指定元素,
              type:'month',
              range: '至', //或 range: '~' 来自定义分割字符
              theme: '#05273e',
              position: 'abolute',
              right:'200px',
              value: moren,
              max:max,
              btns: ['confirm'],
              done: function(value, date, endDate){
                console.log(value); //得到日期生成的值,如:2017-08-18
                console.log(date); //得到日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}
                console.log(endDate); //得结束的日期时间对象,开启范围选择(range: true)才会返回。对象成员同上。
                console.log(vm.firstDay);
                if(date.month < 10){
                    vm.firstDay = date.year+'-0'+date.month+'-01';
                }else{
                    vm.firstDay = date.year+'-'+date.month+'-01';
                }
                if(endDate.month < 10){
                    vm.lastDay = endDate.year+'-0'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }else{
                    vm.lastDay = endDate.year+'-'+endDate.month+'-'+vm.getLastDay(endDate.year,endDate.month);
                }
                vm.halfYearStartDate = getLastHalfMonthArray(endDate.year+'-'+endDate.month)
                vm.halfYearEndDate = vm.lastDay;
                vm.initData(vm.type);
                vm.alertTime = 0;
              }
            //   showBottom: false
            });
        });
        
    },
    methods: {
        initData:function(type){
            var vm = this;
            var linkageFilter1 = "quotaDate >= '" + vm.firstDay + "' and quotaDate <= '" + vm.lastDay + "';";
            var linkageFilter3 = "quotaDate >= '" + vm.halfYearStartDate + "' and quotaDate <= '" + vm.halfYearEndDate + "';";
            console.log(linkageFilter1)
            var code = this.code;
            var urlNumber = '/gov/report/getNoChartTemplateData';
            var urlChart = '/gov/report/getTemplateDataByViewCode';
            var reqUrl = [
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[0],linkageFilter:linkageFilter1}},//死亡原因-人
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[1],linkageFilter:linkageFilter1}},//区县分布-人
                {url:urlNumber,reqType: 'get',data: {viewCodeStr:code[2],linkageFilter:linkageFilter1}},//年龄段分布
                {url:urlChart,reqType: 'get',data: {viewCode:code[3],linkageFilter:linkageFilter1}},//性别分布
                {url:urlChart,reqType: 'get',data: {viewCode:code[4],linkageFilter:linkageFilter3}},//新增患者月趋势
                {url:urlChart,reqType: 'get',data: {viewCode:code[5]}},//老年人就诊趋势-年
            ]
            httpRequest.getReqPromises(reqUrl).then(function(datas) {
                console.log(datas);
                vm.alertChart1 = datas[0].obj.VIEW_13_0038;
                vm.alertChart2 = datas[1].obj.VIEW_13_0039;
                // vm.alertData3 = datas[2].obj.VIEW_15_0002[0].HC_15_1003;
                // vm.alertData4 = datas[2].obj.VIEW_15_0002[0].HC_15_1004;
                var chart1 = datas[2].obj.viewInfos[0].options[0].option;
                var chart2 = datas[3].obj.viewInfos[0].options[0].option;
                var chart3 = datas[4].obj.viewInfos[0].options[0].option;
                var chart4 = datas[5].obj.viewInfos[0].options[0].option;
                // var chart5 = datas[7].obj.viewInfos[0].options[0].option;
                vm.qushiMonth = chart3;
                vm.qushiYear = chart4;
                vm.setAlertChart2(chart1);
                vm.setAlertChart3(chart2);
                // vm.setAlertChart4(chart3);
                vm.setAlertChart5(chart3);
            })
        },
        setAlertChart1:function(data){
            var options = JSON.parse(data);
            options = quxianChart(options);
            // var options = this.bigData[t]['区县分布'];
            // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
            this.alertChart1 = options;
        },
        setAlertChart2:function(data){
            var options = JSON.parse(data);
            options = nianlingChart(options);
            options.color = ["#6576e0","#03fa6c","#ff616f","#0fa5f2","#00e6f3"];
            options.legend.formatter = function(name) {
                var index = 0;
                var clientlabels = options.legend.data;
                var clientcounts = _.map(options.series[0].data,function(item,idx){
                	return item.value;
                });
                clientlabels.forEach(function(value,i){
                    if(value == name){
                        index = i;
                    }
                });
                return name + "  " + clientcounts[index];
            }
            options.legend.left = '48%';
            options.legend.top = 0.044 * window.screen.width;//85;
            options.legend.itemWidth = 0.005 * window.screen.width;//10;
            options.legend.itemHeight = 0.005 * window.screen.width;//10;
            options.legend.itemGap = 0.0078 * window.screen.width;//15;
            options.series[0].center = ['25%','55%'];
            this.alertChart3 = options
        },
        setAlertChart3:function(data){
            var options = JSON.parse(data);
            options = xingbieChart(options);
            options.color = ["#00E7F3","#ff616f"];
            options.legend.formatter = function(name) {
                var index = 0;
                var clientlabels = options.legend.data;
                var clientcounts = _.map(options.series[0].data,function(item,idx){
                	return item.value;
                });
                clientlabels.forEach(function(value,i){
                    if(value == name){
                        index = i;
                    }
                });
                return name + "  " + clientcounts[index];
            }
            options.legend.left = '48%';
            options.legend.top = 0.0625 * window.screen.width;//120
            options.legend.itemWidth = 0.005 * window.screen.width;//10;
            options.legend.itemHeight = 0.005 * window.screen.width;//10;
            options.legend.itemGap = 0.0078 * window.screen.width;//15;
            options.series[0].center = ['25%','55%'];
            this.alertChart4 = options
        },
        setAlertChart4:function(data){
            var options = JSON.parse(data);
            options = jibingTopChart(options);
            options.series[0].label = {show: true,position: "right",color: '#b5e1fc'};
            options.series[0].itemStyle.normal.color = '#FFF71A';
            this.alertChart4 = options
        },
        setAlertChart5:function(data){
            var options = JSON.parse(data);
            options = qushiChart(options);
            // var options = this.bigData[t]['区县分布'];
            // options.series[0].label = {show: true,position: "right",color: '#b5e1fc'}
            this.alertChart5 = options;
            window.chart5 = this.$refs._alertChart5.chart
        },
        alertTitle:function(type){
            this.alertTime = 0;
            this.type = type;
            this.initData(type)
        },
        alertChart:function(time){
            var vm = this;
            this.alertTime = time;
            if(time == 0){
                vm.setAlertChart5(vm.qushiMonth);
            }else if(time == 1){
                vm.setAlertChart5(vm.qushiYear);
            }
        },
        closeAlertClick:function(){
        	parent.layer.closeAll();
        },
        GetQueryString :function (name){
            var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if(r!=null)return  unescape(r[2]); return null;
        },
        chartArea:function(param){
            console.log(param);
        },
        clickBarItem:function(item){
        	console.log(item)
        },
		formatDate: function() {
			//获取上个月第一天
			var firstdate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, 1);
			//获取上个月最后一天
			var date = new Date();
			var day = new Date(date.getFullYear(), date.getMonth(), 0).getDate();
			var enddate = new Date(new Date().getFullYear(), new Date().getMonth() - 1, day);
			//获取本年第一天和最后一天
			var firstYearDate = new Date();
			firstYearDate.setDate(1);
			firstYearMonty = firstYearDate.setMonth(0);
			//近半年开始时间
			var date1 = new Date();
			date1.setMonth(date1.getMonth() - 6);
			var year1 = date1.getFullYear() - 1;
			var month1 = date1.getMonth() + 1;
			month1 = (month1 < 10 ? "0" + month1 : month1);
			//格式化结果
            this.firstDay = firstdate.format("yyyy-MM-dd");
            this.firstMonth = firstdate.format("yyyy-MM");
            this.lastDay = enddate.format("yyyy-MM-dd");
            this.lastMonth = enddate.format("yyyy-MM");
            this.firstDayYear = firstYearDate.format("yyyy-MM-dd");
			this.lastDayYear = (new Date().getFullYear()-1) + "-12-31";
			this.halfYearStartDate = year1.toString() + '-' + month1.toString() + "-01";
			this.halfYearEndDate = this.getCurrentMonthLast2017();
			this.yesterdayDate = this.getYesterday2017(-1, '-');
        },
		getCurrentMonthLast: function() {
			var date = new Date();
			var currentMonth = date.getMonth();
			var nextMonth = ++currentMonth;
			var nextMonthFirstDay = new Date(date.getFullYear(), nextMonth-1, 1);
			var oneDay = 1000 * 60 * 60 * 24;
			return(new Date(nextMonthFirstDay - oneDay)).format("yyyy-MM-dd");
		},
		getYesterday:function(num, str){
			var today = new Date();
		    var nowTime = today.getTime();
		    var ms = 24*3600*1000*num;
		    today.setTime(parseInt(nowTime + ms));
		    var oYear = today.getFullYear();
		    var oMoth = (today.getMonth() + 1).toString();
		    if (oMoth.length <= 1) oMoth = '0' + oMoth;
		    var oDay = today.getDate().toString();
		    if (oDay.length <= 1) oDay = '0' + oDay;
		    return oYear + str + oMoth + str + oDay;
		},
        formatDate2017: function() {
			//获取上个月第一天
			var firstdate = new Date(new Date().getFullYear()-1, new Date().getMonth() - 1, 1);
			//获取上个月最后一天
			var date = new Date();
			var day = new Date(date.getFullYear()-1, date.getMonth(), 0).getDate();
			var enddate = new Date(new Date().getFullYear()-1, new Date().getMonth() - 1, day);
			//获取本年第一天和最后一天
			var firstYearDate = new Date();
			firstYearDate.setFullYear(new Date().getFullYear()-1)
			firstYearDate.setDate(1);
			firstYearMonty = firstYearDate.setMonth(0);
			//近半年开始时间
			var date1 = new Date();
			date1.setMonth(date1.getMonth() - 6);
			var year1 = date1.getFullYear() - 1;
			var month1 = date1.getMonth() + 1;
			month1 = (month1 < 10 ? "0" + month1 : month1);
			//格式化结果
            this.firstDay = firstdate.format("yyyy-MM-dd");
            this.firstMonth = firstdate.format("yyyy-MM");
            this.lastDay = enddate.format("yyyy-MM-dd");
            this.lastMonth = enddate.format("yyyy-MM");
			this.firstDayYear = firstYearDate.format("yyyy-MM-dd");
			this.lastDayYear = (new Date().getFullYear()-1) + "-12-31";
			this.halfYearStartDate = year1.toString() + '-' + month1.toString() + "-01";
			this.halfYearEndDate = this.getCurrentMonthLast2017();
			this.yesterdayDate = this.getYesterday2017(-1, '-');
        },
		getYesterday2017:function(num, str){
			var today = new Date();
		    var nowTime = today.getTime();
		    var ms = 24*3600*1000*num;
		    today.setTime(parseInt(nowTime + ms));
		    var oYear = today.getFullYear()-1;
		    var oMoth = (today.getMonth() + 1).toString();
		    if (oMoth.length <= 1) oMoth = '0' + oMoth;
		    var oDay = today.getDate().toString();
		    if (oDay.length <= 1) oDay = '0' + oDay;
		    return oYear + str + oMoth + str + oDay;
		},
		getCurrentMonthLast2017: function() {
			var date = new Date();
			var currentMonth = date.getMonth();
			var nextMonth = ++currentMonth;
			var nextMonthFirstDay = new Date(date.getFullYear() - 1, nextMonth-1, 1);
			var oneDay = 1000 * 60 * 60 * 24;
			return(new Date(nextMonthFirstDay - oneDay)).format("yyyy-MM-dd");
        },
        getLastDay(year, month) {
            var new_year = year; //取当前的年份
            var new_month = month++; //取下一个月的第一天,方便计算(最后一天不固定)
            if (month > 12) {
              //如果当前大于12月,则年份转到下一年
              new_month -= 12; //月份减
              new_year++; //年份增
            }
            var new_date = new Date(new_year, new_month, 1); //取当年当月中的第一天
            return new Date(new_date.getTime() - 1000 * 60 * 60 * 24).getDate(); //获取当月最后一天日期
        },
    
    }
});
//数字格式化
function toThousands(str) {
    if(!str)return
    str  =parseInt(str);
    if(typeof(str) == 'number')str = str.toString()
	var newStr = "";
	var count = 0;
	if(str.indexOf(".") == -1) {
		for(var i = str.length - 1; i >= 0; i--) {
			if(count % 3 == 0 && count != 0) {
				newStr = str.charAt(i) + "," + newStr;
			} else {
				newStr = str.charAt(i) + newStr;
			}
			count++;
		}
		str = newStr;
	} else {
		for(var i = str.indexOf(".") - 1; i >= 0; i--) {
			if(count % 3 == 0 && count != 0) {
				newStr = str.charAt(i) + "," + newStr;
			} else {
				newStr = str.charAt(i) + newStr; //逐个字符相接起来
			}
			count++;
		}
		str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
	}
	return str;
}

+ 4 - 1
page/bigData/js/alertCharts.js

@ -343,6 +343,9 @@ qushiChart = function(options){
nianlingChart = function(options){
    var title = options.title.text;
    var data = options.series[0].data
    var legend = data.map(function(item){
        return item.name;
    })
    var option =  {
        "title": {
            "text": title,
@ -357,7 +360,7 @@ nianlingChart = function(options){
        },
        legend: {
            orient: 'vertical',
            data: ['0-6', '7-17', '18-40', '41-65', '> 65'],
            data: legend,
            right: '15%',
            top: '25%',
            textStyle: {