medicalCharts.js 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553
  1. var leftChart1DataFormat = function(options) {
  2. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  3. item = parseInt(item.substring(5, 7)) + "月";
  4. return item;
  5. });
  6. var series0data = options.series[0].data || [];
  7. var series1data = options.series[1].data || [];
  8. var option = {
  9. "title": {
  10. "text": "门诊人次月趋势",
  11. "x": "center",
  12. textStyle: {
  13. color: '#b5e1fc',
  14. fontSize: 16,
  15. fontWeight: 'bold'
  16. }
  17. },
  18. tooltip: {
  19. trigger: 'axis',
  20. axisPointer: {
  21. type: 'cross',
  22. crossStyle: {
  23. color: '#fff'
  24. }
  25. },
  26. formatter: '{b} <br /> {a0}: {c0}<br />{a1}: {c1}' + "%"
  27. },
  28. "grid": {
  29. top: '70',
  30. left: '75',
  31. bottom: '40'
  32. },
  33. legend: {
  34. data: ['门诊人次', '环比'],
  35. textStyle: {
  36. color: '#b5e1fc'
  37. },
  38. top: '40'
  39. },
  40. xAxis: [{
  41. type: 'category',
  42. data: xAxisData,
  43. axisPointer: {
  44. type: 'shadow'
  45. },
  46. axisTick: {
  47. show: false
  48. },
  49. axisLine: {
  50. lineStyle: {
  51. color: '#095f8e'
  52. }
  53. },
  54. axisLabel: {
  55. color: '#b5e1fc',
  56. fontSize: 14
  57. }
  58. }],
  59. yAxis: [{
  60. type: 'value',
  61. name: '门诊人次',
  62. nameTextStyle: {
  63. color: '#b5e1fc' // 坐标轴名称颜色
  64. },
  65. splitLine: {
  66. show: false
  67. },
  68. axisLine: {
  69. lineStyle: {
  70. color: '#095f8e'
  71. }
  72. },
  73. axisLabel: {
  74. color: '#b5e1fc',
  75. fontSize: 14
  76. }
  77. },
  78. {
  79. type: 'value',
  80. name: '环比',
  81. min: 0,
  82. max: 4,
  83. nameTextStyle: {
  84. color: '#b5e1fc' // 坐标轴名称颜色
  85. },
  86. splitLine: {
  87. show: false // 不显示坐标轴刻度
  88. },
  89. axisLine: {
  90. lineStyle: {
  91. color: '#095f8e' // 坐标轴轴线颜色
  92. }
  93. },
  94. axisLabel: {
  95. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  96. fontSize: 14
  97. },
  98. show: true
  99. }
  100. ],
  101. series: [{
  102. name: '门诊人次',
  103. type: 'bar',
  104. "data": series0data,
  105. barWidth: 20,
  106. label: {
  107. normal: {
  108. show: true,
  109. position: 'top', // 在柱状图上方显示
  110. color: '#fff' // 柱状图上方显示的数值颜色
  111. }
  112. },
  113. itemStyle: {
  114. barBorderRadius: [8, 8, 0, 0],
  115. color: '#00e6f3'
  116. }
  117. },
  118. {
  119. name: '环比',
  120. type: 'line',
  121. yAxisIndex: 1,
  122. "data": series1data,
  123. itemStyle: {
  124. color: '#03fa6d'
  125. }
  126. }
  127. ]
  128. }
  129. return option;
  130. },
  131. leftChart2DataFormat = function(options){
  132. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  133. item = parseInt(item.substring(5, 7)) + "月";
  134. return item;
  135. });
  136. var series0data = options.series[0].data || [];;
  137. var series1data = options.series[1].data || [];;
  138. var option = {
  139. "title": {
  140. "text": "住院人次月趋势",
  141. "x": "center",
  142. textStyle: {
  143. color: '#b5e1fc',
  144. fontSize: 16,
  145. fontWeight: 'bold'
  146. }
  147. },
  148. tooltip: {
  149. trigger: 'axis',
  150. axisPointer: {
  151. type: 'cross',
  152. crossStyle: {
  153. color: '#fff'
  154. }
  155. }
  156. },
  157. "grid": {
  158. top: '70',
  159. left: '70',
  160. bottom: '40'
  161. },
  162. legend: {
  163. data: ['住院人次', '环比'],
  164. textStyle: {
  165. color: '#b5e1fc'
  166. },
  167. top: '40'
  168. },
  169. xAxis: [{
  170. type: 'category',
  171. data: xAxisData,
  172. axisPointer: {
  173. type: 'shadow'
  174. },
  175. axisTick: {
  176. show: false
  177. },
  178. axisLine: {
  179. lineStyle: {
  180. color: '#095f8e'
  181. }
  182. },
  183. axisLabel: {
  184. color: '#b5e1fc',
  185. fontSize: 14
  186. }
  187. }],
  188. yAxis: [{
  189. type: 'value',
  190. name: '住院人次',
  191. nameTextStyle: {
  192. color: '#b5e1fc' // 坐标轴名称颜色
  193. },
  194. splitLine: {
  195. show: false
  196. },
  197. axisLine: {
  198. lineStyle: {
  199. color: '#095f8e'
  200. }
  201. },
  202. axisLabel: {
  203. color: '#b5e1fc',
  204. fontSize: 14
  205. }
  206. },
  207. {
  208. type: 'value',
  209. name: '环比',
  210. min: 0,
  211. max: 4,
  212. nameTextStyle: {
  213. color: '#b5e1fc' // 坐标轴名称颜色
  214. },
  215. splitLine: {
  216. show: false // 不显示坐标轴刻度
  217. },
  218. axisLine: {
  219. lineStyle: {
  220. color: '#095f8e' // 坐标轴轴线颜色
  221. }
  222. },
  223. axisLabel: {
  224. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  225. fontSize: 14
  226. },
  227. show:true
  228. }
  229. ],
  230. series: [{
  231. name: '住院人次',
  232. type: 'bar',
  233. "data": series0data,
  234. barWidth: 20,
  235. label: {
  236. normal: {
  237. show: true,
  238. position: 'top', // 在柱状图上方显示
  239. color: '#fff' // 柱状图上方显示的数值颜色
  240. }
  241. },
  242. itemStyle: {
  243. barBorderRadius: [8, 8, 0, 0],
  244. color: '#ff616f'
  245. }
  246. },
  247. {
  248. name: '环比',
  249. type: 'line',
  250. yAxisIndex: 1,
  251. "data": series1data,
  252. itemStyle: {
  253. color: '#03fa6d'
  254. }
  255. }
  256. ]
  257. }
  258. return option;
  259. },
  260. rightChart1DataFormat = function(options){
  261. debugger
  262. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  263. item = parseInt(item.substring(5, 7)) + "月";
  264. return item;
  265. });
  266. var series0data = options.series[0].data || [];
  267. var series1data = options.series[1].data || [];
  268. var series2data = options.series[2].data || [];
  269. var series3data = options.series[3].data || [];
  270. var option = {
  271. "title": {
  272. "text": "门诊分类别月趋势",
  273. "x": "center",
  274. textStyle: {
  275. color: '#b5e1fc',
  276. fontSize: 16,
  277. fontWeight: 'bold'
  278. }
  279. },
  280. tooltip: {
  281. trigger: 'axis',
  282. axisPointer: {
  283. type: 'cross',
  284. crossStyle: {
  285. color: '#fff'
  286. }
  287. },
  288. formatter: '{b} <br /> {a0}: {c0}<br />{a1}: {c1}' + "%"
  289. },
  290. "grid":{
  291. top: '80',
  292. left: '80',
  293. bottom: '30'
  294. },
  295. legend: {
  296. data: ['普通号', '专家号', '普通号环比', '专家号环比'],
  297. textStyle: {
  298. color: '#b5e1fc'
  299. },
  300. top: '30',
  301. itemWidth: 10
  302. },
  303. xAxis: [{
  304. type: 'category',
  305. data: xAxisData,
  306. axisPointer: {
  307. type: 'shadow'
  308. },
  309. axisTick: {
  310. show: false
  311. },
  312. axisLine: {
  313. lineStyle: {
  314. color: '#095f8e'
  315. }
  316. },
  317. axisLabel: {
  318. color: '#b5e1fc',
  319. fontSize: 14
  320. }
  321. }],
  322. yAxis: [{
  323. type: 'value',
  324. name: '人次',
  325. nameTextStyle: {
  326. color: '#b5e1fc' // 坐标轴名称颜色
  327. },
  328. splitLine: {
  329. show: false
  330. },
  331. axisLine: {
  332. lineStyle: {
  333. color: '#095f8e'
  334. }
  335. },
  336. axisLabel: {
  337. color: '#b5e1fc',
  338. fontSize: 14
  339. },
  340. splitNumber: 2
  341. },
  342. {
  343. type: 'value',
  344. name: '环比',
  345. min: 0,
  346. max: 4,
  347. nameTextStyle: {
  348. color: '#b5e1fc' // 坐标轴名称颜色
  349. },
  350. splitLine: {
  351. show: false // 不显示坐标轴刻度
  352. },
  353. axisLine: {
  354. lineStyle: {
  355. color: '#095f8e' // 坐标轴轴线颜色
  356. }
  357. },
  358. axisLabel: {
  359. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  360. fontSize: 14
  361. },
  362. show:true
  363. }
  364. ],
  365. series: [{
  366. name: '普通号',
  367. type: 'bar',
  368. "data": series0data,
  369. barWidth: 20,
  370. label: {
  371. normal: {
  372. show: true,
  373. position: 'top', // 在柱状图上方显示
  374. color: '#fff', // 柱状图上方显示的数值颜色
  375. fontSize: 11
  376. }
  377. },
  378. itemStyle: {
  379. barBorderRadius: [8, 8, 0, 0],
  380. color: '#00e6f3'
  381. }
  382. },
  383. {
  384. name: '专家号',
  385. type: 'bar',
  386. "data": series1data,
  387. barWidth: 20,
  388. label: {
  389. normal: {
  390. show: true,
  391. position: 'top', // 在柱状图上方显示
  392. color: '#fff', // 柱状图上方显示的数值颜色
  393. fontSize: 11
  394. }
  395. },
  396. itemStyle: {
  397. barBorderRadius: [8, 8, 0, 0],
  398. color: '#fff71a'
  399. }
  400. },
  401. {
  402. name: '普通号环比',
  403. type: 'line',
  404. yAxisIndex: 1,
  405. "data": series2data,
  406. itemStyle: {
  407. color: '#03fa6d'
  408. }
  409. },
  410. {
  411. name: '专家号环比',
  412. type: 'line',
  413. yAxisIndex: 1,
  414. "data": series3data,
  415. itemStyle: {
  416. color: '#ff616f'
  417. }
  418. },
  419. ]
  420. }
  421. return option;
  422. },
  423. rightChart2DataFormat = function(options){
  424. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  425. item = parseInt(item.substring(5, 7)) + "月";
  426. return item;
  427. });
  428. var series0data = options.series[0].data || [];;
  429. var series1data = options.series[1].data || [];;
  430. var option = {
  431. "title": {
  432. "text": "住院平均日数月趋势",
  433. "x": "center",
  434. textStyle: {
  435. color: '#b5e1fc',
  436. fontSize: 16,
  437. fontWeight: 'bold'
  438. }
  439. },
  440. tooltip: {
  441. trigger: 'axis',
  442. axisPointer: {
  443. type: 'cross',
  444. crossStyle: {
  445. color: '#fff'
  446. }
  447. },
  448. formatter:'{b} <br /> {a0}: {c0}<br />{a1}: {c1}' + "%"
  449. },
  450. "grid": {
  451. top: '70',
  452. left: '60',
  453. bottom: '30'
  454. },
  455. legend: {
  456. data: ['住院平均床日数', '环比'],
  457. textStyle: {
  458. color: '#b5e1fc'
  459. },
  460. top: '30'
  461. },
  462. xAxis: [{
  463. type: 'category',
  464. data: xAxisData,
  465. axisPointer: {
  466. type: 'shadow'
  467. },
  468. axisTick: {
  469. show: false
  470. },
  471. axisLine: {
  472. lineStyle: {
  473. color: '#095f8e'
  474. }
  475. },
  476. axisLabel: {
  477. color: '#b5e1fc',
  478. fontSize: 14
  479. }
  480. }],
  481. yAxis: [{
  482. type: 'value',
  483. name: '天',
  484. nameTextStyle: {
  485. color: '#b5e1fc' // 坐标轴名称颜色
  486. },
  487. splitLine: {
  488. show: false
  489. },
  490. axisLine: {
  491. lineStyle: {
  492. color: '#095f8e'
  493. }
  494. },
  495. axisLabel: {
  496. color: '#b5e1fc',
  497. fontSize: 14
  498. },
  499. splitNumber: 2
  500. },
  501. {
  502. type: 'value',
  503. name: '环比',
  504. min: 0,
  505. max: 4,
  506. nameTextStyle: {
  507. color: '#b5e1fc' // 坐标轴名称颜色
  508. },
  509. splitLine: {
  510. show: false // 不显示坐标轴刻度
  511. },
  512. axisLine: {
  513. lineStyle: {
  514. color: '#095f8e' // 坐标轴轴线颜色
  515. }
  516. },
  517. axisLabel: {
  518. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  519. fontSize: 14
  520. },
  521. show:true
  522. }
  523. ],
  524. series: [{
  525. name: '住院平均床日数',
  526. type: 'bar',
  527. "data": series0data,
  528. barWidth: 20,
  529. label: {
  530. normal: {
  531. show: true,
  532. position: 'top', // 在柱状图上方显示
  533. color: '#fff' // 柱状图上方显示的数值颜色
  534. }
  535. },
  536. itemStyle: {
  537. barBorderRadius: [8, 8, 0, 0],
  538. color: '#00e6f3'
  539. }
  540. },
  541. {
  542. name: '环比',
  543. type: 'line',
  544. yAxisIndex: 1,
  545. "data": series1data,
  546. itemStyle: {
  547. color: '#03fa6d'
  548. }
  549. }
  550. ]
  551. }
  552. return option;
  553. }