app-big-data/page/bigData/js/home.js

toastr.options = {
	"closeButton": true,
	"positionClass": "toast-top-center",
	"preventDuplicates": true
}

new Vue({
	el: '#main',
	data: {
		jsonUrl:"../../../dataJson/jumingHealthJson/高血压人群.json",
		jsonData:null,
        city:'贵港市',
        town:[
            {
                "townName": "贵港市",
                "result": "0"
            },
            {
                "townName": "港北区",
                "result": "26531"
            },
            {
                "townName": "港南区",
                "result": "25634"
            },
            {
                "townName": "桂平市",
                "result": "113485"
            },
            {
                "townName": "平南县",
                "result": "74128"
            },
            {
                "townName": "覃塘区",
                "result": "12587"
            },
        ],
        mapData:null,
		skipShow:0,
		lineHeightIndex:null,
	},
	mounted: function() {
	  this.bindEvents();
      this.getJsonData();
    },
    methods: {
    	getJsonData:function(){
    		var vm = this;
    		bigDataAPI.getJsonData(this.jsonUrl).then(function(res){
    			vm.jsonData = res;
    			var options = _.map(res.town,function(item,idx){
    				var it = {name:item.townName,value:item.result}
    				return it;
    			})
    			 vm.mapData ={data:options,zoom:1,index:vm.lineHeightIndex};  
    		})
    	},
    	bindEvents:function(){
    		var vm = this;
    		EventBus.$on("refresh-json-data", function(arg) {
				var type = arg.type;//0:高血压 1糖尿病 2孕产妇 365岁以上老年人人数
				if(type==0){
					vm.jsonUrl = "../../../dataJson/jumingHealthJson/高血压人群.json";
				}else if(type==1){
					vm.jsonUrl = "../../../dataJson/jumingHealthJson/糖尿病人群.json";
				}else if(type==2){
					vm.jsonUrl = "../../../dataJson/jumingHealthJson/孕产妇人群.json";
				}else if(type==3){
					vm.jsonUrl = "../../../dataJson/jumingHealthJson/65岁以上老年人人数.json";
				}
				vm.getJsonData();
			});
    	},
        setCity(item){
        	this.city = item.townName;
        },
        clickMap:function(res){
           this.city = res.name;

        },
        refreshAllData:function(cityVal){
        	 var vm = this;
        	 cityVal = parseInt(cityVal)
        	 switch(cityVal){
				case 0: vm.jsonUrl = "../../../dataJson/jumingHealthJson/高血压人群.json"; break;//贵港市
				case 26531: vm.jsonUrl = "../../../dataJson/jumingHealthJson/港北区.json"; break;//港北区
				case 25634: vm.jsonUrl = "../../../dataJson/jumingHealthJson/港南区.json";break;//港南区
				case 113485: vm.jsonUrl = "../../../dataJson/jumingHealthJson/桂平市.json"; break;//桂平市
				case 74128: vm.jsonUrl = "../../../dataJson/jumingHealthJson/平南县.json"; break;//平南县
				case 12587:vm.jsonUrl = "../../../dataJson/jumingHealthJson/覃塘区.json"; break;//覃塘区
				default:break;
			}
           vm.getJsonData();
        },
		skipClick:function(){
			console.log(222)
			this.skipShow == 0 ? this.skipShow = 1 : this.skipShow = 0
		}
    },
    watch:{
    	jsonData:function(data){
    		this.jsonData = data;
		},
		city:function(value){
			var that =this;
			that.lineHeightIndex =value;
			// debugger
            this.town.map(function(v,i){
                if(v.townName == value) {
					that.refreshAllData(v.result);
                  
                  
                }
            })

		
		}
    }
});

//数字格式化
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;
}