home.js 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140
  1. toastr.options = {
  2. "closeButton": true,
  3. "positionClass": "toast-top-center",
  4. "preventDuplicates": true
  5. }
  6. new Vue({
  7. el: '#main',
  8. data: {
  9. jsonUrl:"../../../dataJson/jumingHealthJson/高血压人群.json",
  10. jsonData:null,
  11. city:'贵港市',
  12. town:[
  13. {
  14. "townName": "贵港市",
  15. "result": "0"
  16. },
  17. {
  18. "townName": "港北区",
  19. "result": "26531"
  20. },
  21. {
  22. "townName": "港南区",
  23. "result": "25634"
  24. },
  25. {
  26. "townName": "桂平市",
  27. "result": "113485"
  28. },
  29. {
  30. "townName": "平南县",
  31. "result": "74128"
  32. },
  33. {
  34. "townName": "覃塘区",
  35. "result": "12587"
  36. },
  37. ],
  38. mapData:null,
  39. skipShow:0,
  40. },
  41. mounted: function() {
  42. this.bindEvents();
  43. this.getJsonData();
  44. },
  45. methods: {
  46. getJsonData:function(){
  47. var vm = this;
  48. bigDataAPI.getJsonData(this.jsonUrl).then(function(res){
  49. vm.jsonData = res;
  50. var options = _.map(res.town,function(item,idx){
  51. var it = {name:item.townName,value:item.result}
  52. return it;
  53. })
  54. vm.mapData ={data:options,zoom:1};
  55. })
  56. },
  57. bindEvents:function(){
  58. var vm = this;
  59. EventBus.$on("refresh-json-data", function(arg) {
  60. var type = arg.type;//0:高血压 1糖尿病
  61. if(type==0){
  62. vm.jsonUrl = "../../../dataJson/jumingHealthJson/高血压人群.json";
  63. }else if(type==1){
  64. vm.jsonUrl = "../../../dataJson/jumingHealthJson/糖尿病人群.json";
  65. }
  66. vm.getJsonData();
  67. });
  68. },
  69. setCity(item){
  70. this.city = item.townName;
  71. var vm =this;
  72. this.town.map(function(v,i){
  73. if(v.townName == item.townName) {
  74. vm.$refs.map.selectLineHeight(i) //高亮地图
  75. vm.refreshAllData(item.result);
  76. }
  77. })
  78. },
  79. clickMap:function(res){
  80. this.city = res.name;
  81. this.refreshAllData(res.value);
  82. },
  83. refreshAllData:function(cityVal){
  84. var vm = this;
  85. cityVal = parseInt(cityVal)
  86. switch(cityVal){
  87. case 0: vm.jsonUrl = "../../../dataJson/jumingHealthJson/高血压人群.json"; break;//贵港市
  88. case 26531: vm.jsonUrl = "../../../dataJson/jumingHealthJson/港北区.json"; break;//港北区
  89. case 25634: vm.jsonUrl = "../../../dataJson/jumingHealthJson/港南区.json";break;//港南区
  90. case 113485: vm.jsonUrl = "../../../dataJson/jumingHealthJson/桂平市.json"; break;//桂平市
  91. case 74128: vm.jsonUrl = "../../../dataJson/jumingHealthJson/平南县.json"; break;//平南县
  92. case 12587:vm.jsonUrl = "../../../dataJson/jumingHealthJson/覃塘区.json"; break;//覃塘区
  93. default:break;
  94. }
  95. vm.getJsonData();
  96. },
  97. skipClick:function(){
  98. console.log(222)
  99. this.skipShow == 0 ? this.skipShow = 1 : this.skipShow = 0
  100. }
  101. },
  102. watch:{
  103. jsonData:function(data){
  104. this.jsonData = data;
  105. }
  106. }
  107. });
  108. //数字格式化
  109. function toThousands(str) {
  110. if(!str)return
  111. str =parseInt(str);
  112. if(typeof(str) == 'number')str = str.toString()
  113. var newStr = "";
  114. var count = 0;
  115. if(str.indexOf(".") == -1) {
  116. for(var i = str.length - 1; i >= 0; i--) {
  117. if(count % 3 == 0 && count != 0) {
  118. newStr = str.charAt(i) + "," + newStr;
  119. } else {
  120. newStr = str.charAt(i) + newStr;
  121. }
  122. count++;
  123. }
  124. str = newStr;
  125. } else {
  126. for(var i = str.indexOf(".") - 1; i >= 0; i--) {
  127. if(count % 3 == 0 && count != 0) {
  128. newStr = str.charAt(i) + "," + newStr;
  129. } else {
  130. newStr = str.charAt(i) + newStr; //逐个字符相接起来
  131. }
  132. count++;
  133. }
  134. str = newStr + (str + "00").substr((str + "00").indexOf("."), 3);
  135. }
  136. return str;
  137. }