chartData.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291
  1. /**
  2. * Created by Administrator on 2017/5/17.
  3. */
  4. // 营销分析
  5. //
  6. // 门票渠道饼图分析
  7. $(function(){
  8. var myChart = echarts.init($(".dataLeft01Conentup02")[0]);
  9. option = {
  10. tooltip : {
  11. trigger: 'item',
  12. formatter: "{a} <br/>{b} : {c} ({d}%)"
  13. },
  14. legend: {
  15. orient : 'vertical',
  16. x : 'left',
  17. data:['官网电商发售','景区窗口发售','合作商家推广','美图/糯米/携程'],
  18. textStyle:{color:'#1580d9'}
  19. },
  20. calculable : false,
  21. series : [
  22. {
  23. name:'发售渠道',
  24. type:'pie',
  25. radius : ['50%', '70%'],
  26. center: ['75%', '50%'],
  27. itemStyle : {
  28. normal : {
  29. label : {
  30. show : false
  31. },
  32. labelLine : {
  33. show : false
  34. }
  35. },
  36. emphasis : {
  37. label : {
  38. show : true,
  39. position : 'center',
  40. textStyle : {
  41. fontSize : '13',
  42. fontWeight : 'bold'
  43. }
  44. }
  45. }
  46. },
  47. data:[
  48. {value:335, name:'官网电商发售',itemStyle:{
  49. normal:{color:'#ff7d2e'}
  50. }},
  51. {value:310, name:'景区窗口发售',itemStyle:{
  52. normal:{color:'#ffb400'}
  53. }},
  54. {value:234, name:'合作商家推广',itemStyle:{
  55. normal:{color:'#f0573d'}
  56. }},
  57. {value:135, name:'美图/糯米/携程',itemStyle:{
  58. normal:{color:'#3d4145'}
  59. }}
  60. ]
  61. }
  62. ]
  63. };
  64. myChart.setOption(option);
  65. });
  66. $(function(){
  67. var myChart = echarts.init($(".dataLeft01Conentdown")[0]);
  68. option = {
  69. grid:{
  70. x:'10%',
  71. y:'5%',
  72. x2:'5%',
  73. y2:'15%',
  74. borderWidth: 0
  75. },
  76. color:['#0555c2', '#2d95ed','#eee'],
  77. tooltip : {
  78. trigger: 'axis'
  79. },
  80. calculable : true,
  81. xAxis : [
  82. {
  83. type : 'category',
  84. splitLine:{
  85. show:false
  86. },
  87. axisLabel: {
  88. show: true,
  89. axisLine:{
  90. lineStyle:{
  91. show:false
  92. }
  93. },
  94. textStyle: {
  95. color: '#fff'
  96. }
  97. },
  98. boundaryGap : false,
  99. data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12','13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24']
  100. }
  101. ],
  102. yAxis : [
  103. {
  104. type : 'value',
  105. axisLabel: {
  106. show: true,
  107. axisLine:{
  108. lineStyle:{
  109. show:false
  110. }
  111. },
  112. textStyle: {
  113. color: '#fff',
  114. fontsize:'0.5em'
  115. }
  116. },
  117. }
  118. ],
  119. series : [
  120. {
  121. name:'峰值',
  122. type:'line',
  123. smooth:true,
  124. itemStyle: {normal: {areaStyle: {type: 'default'}}},
  125. data: [320, 332, 1210, 246, 199, 530, 210, 230, 340, 256, 278, 300,320, 132, 101, 546, 299, 230, 210, 230, 240, 256, 278, 200]
  126. },
  127. {
  128. name:'峰值',
  129. type:'line',
  130. smooth:true,
  131. itemStyle: {normal: {areaStyle: {type: 'default'}}},
  132. data:[120, 132, 191, 646, 199, 730, 210, 230, 240, 256, 178, 300,120, 132, 301, 546, 199, 230, 210, 230, 340, 256, 278, 300]
  133. }, {
  134. name:'入园人数',
  135. type:'line',
  136. smooth:true,
  137. data:[820, 632, 1101, 546, 599, 630, 810, 630, 540, 656, 1278, 700,820, 632, 601, 746, 599, 730, 610, 530, 840, 756, 678, 600]
  138. }
  139. ]
  140. };
  141. myChart.setOption(option);
  142. window.onresize = myChart.resize;
  143. });
  144. $(function(){
  145. var myChart = echarts.init($("#pieChart")[0]);
  146. option = {
  147. tooltip : {
  148. trigger: 'item',
  149. formatter: "{a} <br/>{b} : {c} ({d}%)"
  150. },
  151. color:['#20d0ca', '#0a89d2','#f0573d'],
  152. // legend: {
  153. // x : 'center',
  154. // y : 'top',
  155. // data:['个人','团购','旅行社'],
  156. // textStyle:{
  157. // color:'#fff'
  158. // }
  159. // },
  160. calculable : false,
  161. series : [
  162. {
  163. name:'数据统计',
  164. type:'pie',
  165. radius : ['1%', 50],
  166. center : ['50%', '35%'],
  167. roseType : 'radius',
  168. width: '40%', // for funnel
  169. max: 40, // for funnel
  170. itemStyle : {
  171. normal : {
  172. label : {
  173. show : false
  174. },
  175. labelLine : {
  176. show : false
  177. }
  178. },
  179. emphasis : {
  180. label : {
  181. show : true
  182. },
  183. labelLine : {
  184. show : true
  185. }
  186. }
  187. },
  188. data:[
  189. {value:10, name:'个人'},
  190. {value:5, name:'团购'},
  191. {value:15, name:'旅行社'}
  192. ]
  193. },
  194. ]
  195. };
  196. myChart.setOption(option);
  197. window.onresize = myChart.resize;
  198. });
  199. $(function(){
  200. var myChart = echarts.init($(".weherChart")[0]);
  201. option = {
  202. grid:{
  203. x:'2%',
  204. y:'25%',
  205. x2:'2%',
  206. y2:'1%',
  207. borderWidth: 0
  208. },
  209. color:['#94bc3c', '#40cf28'],
  210. tooltip : {
  211. trigger: 'axis'
  212. },
  213. splitLine:{
  214. show:false
  215. },
  216. legend: {
  217. data:['2016年','2017年'],
  218. textStyle:{color:'#2c85ff'}
  219. },
  220. calculable : false,
  221. xAxis : [
  222. {
  223. type : 'category',
  224. axisLabel: {
  225. show: false,
  226. },
  227. boundaryGap : false,
  228. data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12','13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24'],
  229. splitLine:{
  230. show:false
  231. },
  232. }
  233. ],
  234. yAxis : [
  235. {
  236. type : 'value',
  237. axisLabel: {
  238. show: false,
  239. },
  240. splitLine:{
  241. show:false
  242. },
  243. }
  244. ],
  245. series : [
  246. {
  247. name:'2016年',
  248. type:'line',
  249. smooth:true,
  250. itemStyle: {normal: {areaStyle: {type: 'default'}}},
  251. data: [320, 332, 501, 1246, 299, 530, 210, 230, 340, 656, 878, 300,320, 632, 901, 546, 299, 230, 210, 230, 240, 856, 278, 1200]
  252. },
  253. {
  254. name:'2017年',
  255. type:'line',
  256. smooth:true,
  257. itemStyle: {normal: {areaStyle: {type: 'default'}}},
  258. data:[820, 1032, 901, 1046, 599, 230, 1210, 230, 540, 256, 1278, 300,1200, 532, 901, 746, 699, 1230, 1210, 630, 840, 656, 1278, 900]
  259. }
  260. ]
  261. };
  262. myChart.setOption(option);
  263. window.onresize = myChart.resize;
  264. });