pie_mode.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. function load_guage(datax,datay1,datay2){
  2. var option = {
  3. legend: {
  4. x : 'center',
  5. y : 'center',
  6. show:false,
  7. data:[
  8. '剧情', '奇幻', '爱情', '惊悚', '冒险', '动作', '喜剧', '科幻','悬疑','犯罪'
  9. ]
  10. },
  11. title : {
  12. text: '剧情',
  13. x: 'center',
  14. y:'center',
  15. show:true,
  16. textStyle: {
  17. color : 'red',
  18. fontSize: 16
  19. }
  20. },
  21. toolbox: {
  22. show : false,
  23. feature : {
  24. dataView : {show: true, readOnly: false},
  25. magicType : {
  26. show: true,
  27. type: ['pie', 'funnel'],
  28. option: {
  29. funnel: {
  30. width: '20%',
  31. height: '30%',
  32. itemStyle : {
  33. normal : {
  34. label : {
  35. formatter : function (params){
  36. return 'other\n' + params.value + '%\n'
  37. },
  38. textStyle: {
  39. baseline : 'middle',
  40. }
  41. }
  42. },
  43. }
  44. }
  45. }
  46. },
  47. restore : {show: true},
  48. saveAsImage : {show: true}
  49. }
  50. },
  51. series : [
  52. {
  53. type : 'pie',
  54. center : ['50%', '50%'],
  55. radius : ['35%','55%'],
  56. x: '50%', // for funnel
  57. itemStyle : {
  58. normal : {
  59. label : {
  60. textStyle: {
  61. baseline : 'center',
  62. position : 'inside',
  63. }
  64. },
  65. color:'red'
  66. },
  67. },
  68. labelLine : {
  69. show : false
  70. },
  71. label : {
  72. show : false,
  73. position : 'inside',
  74. formatter : '{b}',
  75. textStyle: {
  76. baseline : 'bottom',
  77. fontSize: 16
  78. }
  79. },
  80. data : [
  81. {name:'', value:datay1[1],
  82. itemStyle : {
  83. normal : {
  84. }
  85. }
  86. },
  87. {name:'', value:datay1[0],
  88. itemStyle : {
  89. normal : {
  90. color: 'rgba(175,169,169,.4)',
  91. label : {
  92. show : false,
  93. position : 'inside'
  94. }
  95. },
  96. emphasis: {
  97. color: 'rgba(0,0,0,0)'
  98. }
  99. }
  100. }
  101. ]
  102. },
  103. {
  104. type : 'pie',
  105. center : ['50%', '50%'],
  106. radius : ['35%','45%'],
  107. itemStyle : {
  108. normal : {
  109. label : {
  110. textStyle: {
  111. baseline : 'top'
  112. }
  113. },
  114. color:'blue'
  115. },
  116. },
  117. labelLine : {
  118. show : false
  119. },
  120. label : {
  121. show : false,
  122. position : 'inside',
  123. formatter : '{b}',
  124. textStyle: {
  125. baseline : 'bottom'
  126. }
  127. },
  128. data : [
  129. {name:'', value:datay2[1],
  130. itemStyle : {
  131. normal : {
  132. }
  133. }
  134. },
  135. {name:'', value:datay2[0],
  136. itemStyle : {
  137. normal : {
  138. color: 'rgba(96,96,96,.5)',
  139. label : {
  140. show : false,
  141. position : 'inside'
  142. }
  143. },
  144. emphasis: {
  145. color: 'rgba(0,0,0,0)'
  146. }
  147. }
  148. },
  149. ]
  150. }
  151. ],
  152. animationDuration:7000,
  153. animationEasing:'elasticOut',
  154. animationDelayupdate:function(idx){
  155. return idx * 15;
  156. }
  157. };
  158. return option;
  159. }