medicalCharts.js 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552
  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. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  262. item = parseInt(item.substring(5, 7)) + "月";
  263. return item;
  264. });
  265. var series0data = options.series[0].data || [];
  266. var series1data = options.series[1].data || [];
  267. var series2data = options.series[2].data || [];
  268. var series3data = options.series[3].data || [];
  269. var option = {
  270. "title": {
  271. "text": "门诊分类别月趋势",
  272. "x": "center",
  273. textStyle: {
  274. color: '#b5e1fc',
  275. fontSize: 16,
  276. fontWeight: 'bold'
  277. }
  278. },
  279. tooltip: {
  280. trigger: 'axis',
  281. axisPointer: {
  282. type: 'cross',
  283. crossStyle: {
  284. color: '#fff'
  285. }
  286. },
  287. formatter: '{b} <br /> {a0}: {c0}<br />{a1}: {c1}' + "%"
  288. },
  289. "grid":{
  290. top: '80',
  291. left: '80',
  292. bottom: '30'
  293. },
  294. legend: {
  295. data: ['普通号', '专家号', '普通号环比', '专家号环比'],
  296. textStyle: {
  297. color: '#b5e1fc'
  298. },
  299. top: '30',
  300. itemWidth: 10
  301. },
  302. xAxis: [{
  303. type: 'category',
  304. data: xAxisData,
  305. axisPointer: {
  306. type: 'shadow'
  307. },
  308. axisTick: {
  309. show: false
  310. },
  311. axisLine: {
  312. lineStyle: {
  313. color: '#095f8e'
  314. }
  315. },
  316. axisLabel: {
  317. color: '#b5e1fc',
  318. fontSize: 14
  319. }
  320. }],
  321. yAxis: [{
  322. type: 'value',
  323. name: '人次',
  324. nameTextStyle: {
  325. color: '#b5e1fc' // 坐标轴名称颜色
  326. },
  327. splitLine: {
  328. show: false
  329. },
  330. axisLine: {
  331. lineStyle: {
  332. color: '#095f8e'
  333. }
  334. },
  335. axisLabel: {
  336. color: '#b5e1fc',
  337. fontSize: 14
  338. },
  339. splitNumber: 2
  340. },
  341. {
  342. type: 'value',
  343. name: '环比',
  344. min: 0,
  345. max: 4,
  346. nameTextStyle: {
  347. color: '#b5e1fc' // 坐标轴名称颜色
  348. },
  349. splitLine: {
  350. show: false // 不显示坐标轴刻度
  351. },
  352. axisLine: {
  353. lineStyle: {
  354. color: '#095f8e' // 坐标轴轴线颜色
  355. }
  356. },
  357. axisLabel: {
  358. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  359. fontSize: 14
  360. },
  361. show:true
  362. }
  363. ],
  364. series: [{
  365. name: '普通号',
  366. type: 'bar',
  367. "data": series0data,
  368. barWidth: 20,
  369. label: {
  370. normal: {
  371. show: true,
  372. position: 'top', // 在柱状图上方显示
  373. color: '#fff', // 柱状图上方显示的数值颜色
  374. fontSize: 11
  375. }
  376. },
  377. itemStyle: {
  378. barBorderRadius: [8, 8, 0, 0],
  379. color: '#00e6f3'
  380. }
  381. },
  382. {
  383. name: '专家号',
  384. type: 'bar',
  385. "data": series1data,
  386. barWidth: 20,
  387. label: {
  388. normal: {
  389. show: true,
  390. position: 'top', // 在柱状图上方显示
  391. color: '#fff', // 柱状图上方显示的数值颜色
  392. fontSize: 11
  393. }
  394. },
  395. itemStyle: {
  396. barBorderRadius: [8, 8, 0, 0],
  397. color: '#fff71a'
  398. }
  399. },
  400. {
  401. name: '普通号环比',
  402. type: 'line',
  403. yAxisIndex: 1,
  404. "data": series2data,
  405. itemStyle: {
  406. color: '#03fa6d'
  407. }
  408. },
  409. {
  410. name: '专家号环比',
  411. type: 'line',
  412. yAxisIndex: 1,
  413. "data": series3data,
  414. itemStyle: {
  415. color: '#ff616f'
  416. }
  417. },
  418. ]
  419. }
  420. return option;
  421. },
  422. rightChart2DataFormat = function(options){
  423. var xAxisData = _.map(options.xAxis[0].data, function(item, idx) {
  424. item = parseInt(item.substring(5, 7)) + "月";
  425. return item;
  426. });
  427. var series0data = options.series[0].data || [];;
  428. var series1data = options.series[1].data || [];;
  429. var option = {
  430. "title": {
  431. "text": "住院平均日数月趋势",
  432. "x": "center",
  433. textStyle: {
  434. color: '#b5e1fc',
  435. fontSize: 16,
  436. fontWeight: 'bold'
  437. }
  438. },
  439. tooltip: {
  440. trigger: 'axis',
  441. axisPointer: {
  442. type: 'cross',
  443. crossStyle: {
  444. color: '#fff'
  445. }
  446. },
  447. formatter:'{b} <br /> {a0}: {c0}<br />{a1}: {c1}' + "%"
  448. },
  449. "grid": {
  450. top: '70',
  451. left: '60',
  452. bottom: '30'
  453. },
  454. legend: {
  455. data: ['住院平均床日数', '环比'],
  456. textStyle: {
  457. color: '#b5e1fc'
  458. },
  459. top: '30'
  460. },
  461. xAxis: [{
  462. type: 'category',
  463. data: xAxisData,
  464. axisPointer: {
  465. type: 'shadow'
  466. },
  467. axisTick: {
  468. show: false
  469. },
  470. axisLine: {
  471. lineStyle: {
  472. color: '#095f8e'
  473. }
  474. },
  475. axisLabel: {
  476. color: '#b5e1fc',
  477. fontSize: 14
  478. }
  479. }],
  480. yAxis: [{
  481. type: 'value',
  482. name: '天',
  483. nameTextStyle: {
  484. color: '#b5e1fc' // 坐标轴名称颜色
  485. },
  486. splitLine: {
  487. show: false
  488. },
  489. axisLine: {
  490. lineStyle: {
  491. color: '#095f8e'
  492. }
  493. },
  494. axisLabel: {
  495. color: '#b5e1fc',
  496. fontSize: 14
  497. },
  498. splitNumber: 2
  499. },
  500. {
  501. type: 'value',
  502. name: '环比',
  503. min: 0,
  504. max: 4,
  505. nameTextStyle: {
  506. color: '#b5e1fc' // 坐标轴名称颜色
  507. },
  508. splitLine: {
  509. show: false // 不显示坐标轴刻度
  510. },
  511. axisLine: {
  512. lineStyle: {
  513. color: '#095f8e' // 坐标轴轴线颜色
  514. }
  515. },
  516. axisLabel: {
  517. color: '#b5e1fc', // 坐标轴刻度标签文本颜色
  518. fontSize: 14
  519. },
  520. show:true
  521. }
  522. ],
  523. series: [{
  524. name: '住院平均床日数',
  525. type: 'bar',
  526. "data": series0data,
  527. barWidth: 20,
  528. label: {
  529. normal: {
  530. show: true,
  531. position: 'top', // 在柱状图上方显示
  532. color: '#fff' // 柱状图上方显示的数值颜色
  533. }
  534. },
  535. itemStyle: {
  536. barBorderRadius: [8, 8, 0, 0],
  537. color: '#00e6f3'
  538. }
  539. },
  540. {
  541. name: '环比',
  542. type: 'line',
  543. yAxisIndex: 1,
  544. "data": series1data,
  545. itemStyle: {
  546. color: '#03fa6d'
  547. }
  548. }
  549. ]
  550. }
  551. return option;
  552. }