tabpic.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. function gettabfun(){
  2. $.get('../test.json',function (data) {
  3. var Allarr = new Array();
  4. for (var i=0;i<26;i++){
  5. Allarr[i] = new Array();
  6. }
  7. var stuarr =
  8. ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","X","Y","Z"];
  9. var lenarr = new Array();
  10. for(var i=0;i<data.length;i++){
  11. for (var j=0;j<stuarr.length;j++){
  12. if (data[i]["empName"].charAt(0) == stuarr[j]) {
  13. Allarr[j].push(stuarr[j]);
  14. }
  15. }
  16. }
  17. for (var i=0;i<Allarr.length;i++){
  18. lenarr.push(Allarr[i].length);
  19. }
  20. var varr = new Array();
  21. for (var i=0;i<lenarr.length;i++){
  22. varr.push(lenarr[i]/data.length);
  23. }
  24. var myChart = echarts.init(document.getElementById("main"));
  25. var myChart1 = echarts.init(document.getElementById("main1"));
  26. option = {
  27. tooltip: {
  28. trigger: 'item',
  29. formatter: "{a} <br/>{b}: {c} ({d}%)"
  30. },
  31. legend: {
  32. orient: 'vertical',
  33. type: "scroll",
  34. right: 10,
  35. top: 20,
  36. bottom: 20,
  37. data:["name include of A","name include of B","name include of C","name include of D","name include of E",
  38. "name include of F","name include of G","name include of H","name include of I","name include of J",
  39. "name include of K","name include of L","name include of M","name include of N","name include of O",
  40. "name include of P","name include of Q","name include of R","name include of S","name include of T",
  41. "name include of U","name include of V","name include of X","name include of Y","name include of Z"]
  42. },
  43. series: [
  44. {
  45. name:"name",
  46. type:'pie',
  47. radius: ['50%', '70%'],
  48. avoidLabelOverlap: false,
  49. label: {
  50. normal: {
  51. show: false,
  52. position: 'center'
  53. },
  54. emphasis: {
  55. show: true,
  56. textStyle: {
  57. fontSize: '15',
  58. fontWeight: 'bold'
  59. }
  60. }
  61. },
  62. labelLine: {
  63. normal: {
  64. show: false
  65. }
  66. },
  67. data:[
  68. {value:varr[0]*100, name:'name include of A'},
  69. {value:varr[1]*100, name:'name include of B'},
  70. {value:varr[2]*100, name:'name include of C'},
  71. {value:varr[3]*100, name:'name include of D'},
  72. {value:varr[4]*100, name:'name include of E'},
  73. {value:varr[5]*100, name:'name include of F'},
  74. {value:varr[6]*100, name:'name include of G'},
  75. {value:varr[7]*100, name:'name include of H'},
  76. {value:varr[8]*100, name:'name include of I'},
  77. {value:varr[9]*100, name:'name include of J'},
  78. {value:varr[10]*100, name:'name include of K'},
  79. {value:varr[11]*100, name:'name include of L'},
  80. {value:varr[12]*100, name:'name include of M'},
  81. {value:varr[13]*100, name:'name include of N'},
  82. {value:varr[14]*100, name:'name include of O'},
  83. {value:varr[15]*100, name:'name include of P'},
  84. {value:varr[16]*100, name:'name include of Q'},
  85. {value:varr[17]*100, name:'name include of R'},
  86. {value:varr[18]*100, name:'name include of S'},
  87. {value:varr[19]*100, name:'name include of T'},
  88. {value:varr[20]*100, name:'name include of U'},
  89. {value:varr[21]*100, name:'name include of V'},
  90. {value:varr[22]*100, name:'name include of W'},
  91. {value:varr[23]*100, name:'name include of X'},
  92. {value:varr[24]*100, name:'name include of Y'},
  93. {value:varr[25]*100, name:'name include of Z'},
  94. ]
  95. }
  96. ]
  97. }
  98. var sexarr = new Array();
  99. for (var j=0;j<2;j++){
  100. sexarr[j] = new Array();
  101. }
  102. for (var i=0;i<data.length;i++){
  103. if (data[i]["gender"] == "男"){
  104. sexarr[0].push(data[i]);
  105. } else {
  106. sexarr[1].push(data[i]);
  107. }
  108. }
  109. option1 = {
  110. xAxis: {
  111. type: 'category',
  112. data: ['男', '女']
  113. },
  114. yAxis: {
  115. type: 'value'
  116. },
  117. series: [{
  118. data: [sexarr[0].length, sexarr[1].length],
  119. type: 'bar'
  120. }]
  121. }
  122. myChart.setOption(option);
  123. myChart1.setOption(option1);
  124. },'json');
  125. }