base.js 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582
  1. //
  2. $('#myTabs a').click(function (e) {
  3. e.preventDefault()
  4. $(this).tab('show')
  5. });
  6. $(document).ready(function() {
  7. Highcharts.setOptions({
  8. colors: ['#8129dd', '#8ec63f','#2756ca','#f1b601','#f86423','#27aae3']
  9. });
  10. var chart1 = $("#container1").highcharts({
  11. chart: {
  12. renderTo: 'container1', //装载图表的div容器id
  13. type: 'bar',
  14. backgroundColor: '#1e2131',
  15. plotBorderColor: '#1c2a38',
  16. plotBorderWidth: 1,
  17. },
  18. title: false,//主标题
  19. subtitle: false,//副标题
  20. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  21. },
  22. xAxis: {
  23. categories: ['阿克苏', '地阿娇', '萨克斯', '奥苏乔', '小乔','盎司看', '违纪', '万能家', '立海运', '阿萨'],
  24. labels: {
  25. style: {
  26. color: '#9ea0ae'
  27. }
  28. },
  29. tickWidth:'0',
  30. tickColor:'#1c2a38',
  31. lineColor: '#1c2a38',
  32. }, // x系列设置
  33. yAxis: {
  34. // min: 0,
  35. title: {
  36. text: '排行榜(条)',
  37. align: 'high'
  38. },
  39. tickColor:'#1c2a38',
  40. gridLineColor: '#1c2a38',
  41. labels: {
  42. overflow: 'justify'
  43. }
  44. },// y系列设置
  45. tooltip: {
  46. valueSuffix: ' 百万'
  47. },
  48. plotOptions: {
  49. bar: {
  50. dataLabels: {
  51. enabled: true,
  52. allowOverlap: true,
  53. color:'#fff',
  54. },
  55. borderColor: "",//去边框
  56. color:'#0084fe'
  57. }
  58. },
  59. legend:false,
  60. credits: {
  61. enabled: false
  62. },
  63. series: [{
  64. name: '发稿量',
  65. data: [635,400,300, 203,107,100,65,38,31, 5],
  66. color:'#0084fe',
  67. border:'#0084fe'
  68. }]
  69. });
  70. var chart2 = $("#container2").highcharts({
  71. chart: {
  72. renderTo: 'container2', //装载图表的div容器id
  73. type: 'bar',
  74. backgroundColor: '#1e2131',
  75. plotBorderColor: '#1c2a38',
  76. plotBorderWidth: 1,
  77. },
  78. title: false,//主标题
  79. subtitle: false,//副标题
  80. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  81. },
  82. xAxis: {
  83. categories: ['阿克苏', '地阿娇', '萨克斯', '奥苏乔', '小乔','盎司看', '违纪', '万能家', '立海运', '阿萨'],
  84. labels: {
  85. style: {
  86. color: '#9ea0ae'
  87. }
  88. },
  89. tickWidth:'0',
  90. tickColor:'#1c2a38',
  91. lineColor: '#1c2a38',
  92. }, // x系列设置
  93. yAxis: {
  94. // min: 0,
  95. title: {
  96. text: '排行榜(条)',
  97. align: 'high'
  98. },
  99. tickColor:'#1c2a38',
  100. gridLineColor: '#1c2a38',
  101. labels: {
  102. overflow: 'justify'
  103. }
  104. },// y系列设置
  105. tooltip: {
  106. valueSuffix: ' 百万'
  107. },
  108. plotOptions: {
  109. bar: {
  110. dataLabels: {
  111. enabled: true,
  112. allowOverlap: true,
  113. color:'#fff',
  114. },
  115. borderColor: "",//去边框
  116. color:'#0084fe'
  117. }
  118. },
  119. legend:false,
  120. credits: {
  121. enabled: false
  122. },
  123. series: [{
  124. name: '发稿量',
  125. data: [635,400,300, 203,107,100,65,38,31, 5],
  126. color:'#0084fe',
  127. border:'#0084fe'
  128. }]
  129. });
  130. var chart3 = $("#jglxchart").highcharts({
  131. chart: {
  132. backgroundColor: '#1e2131',
  133. type: 'column',
  134. plotBorderColor: '#1c2a38',
  135. plotBorderWidth: 1,
  136. },
  137. title:false,
  138. xAxis: {
  139. gridLineColor: '#1c2a38',//网格线
  140. tickColor:'#1c2a38',//刻度线
  141. lineColor: '#1c2a38',//轴线
  142. categories: ['宏观经济', '资本市场', '货币市场', '外汇市场', '债券市场','大宗商品']
  143. },
  144. yAxis: {
  145. min: 0,
  146. title:false,
  147. gridLineColor: '#1c2a38',//网格线
  148. tickColor:'#1c2a38',//刻度线
  149. stackLabels: {
  150. enabled: true,
  151. style: {
  152. fontWeight: 'bold',
  153. color: (Highcharts.theme && Highcharts.theme.textColor) || '#fff'
  154. }//柱形图上方数据显示
  155. }
  156. },
  157. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  158. },
  159. credits:{
  160. enabled: false // 禁用版权信息
  161. },
  162. legend: {
  163. layout: 'horizontal',
  164. align: 'center',
  165. verticalAlign: 'bottom',
  166. itemStyle: { cursor: 'pointer', color: '#FFF' },
  167. itemHiddenStyle: { color: '#CCC' },
  168. },
  169. tooltip: {
  170. formatter: function () {
  171. return '<b>' + this.x + '</b><br/>' +
  172. this.series.name + ': ' + this.y + '<br/>' +
  173. '总量: ' + this.point.stackTotal;
  174. }
  175. },
  176. plotOptions: {
  177. column: { //不显示阴影
  178. stacking: 'normal',
  179. bar: false,
  180. borderWidth: 0, //柱子边框的大小
  181. },
  182. },
  183. series: [{
  184. name: '原创',
  185. data: [5, 3, 4, 7, 2,4]
  186. }, {
  187. name: '编辑',
  188. data: [2, 2, 3, 2, 1,7]
  189. }, {
  190. name: '编译',
  191. data: [3, 4, 4, 2, 5,3]
  192. }]
  193. });
  194. var chart4 = $("#qst-monthchart").highcharts({
  195. chart: {
  196. backgroundColor: '#1e2131',
  197. plotBorderColor: '#1c2a38',
  198. plotBorderWidth: 1
  199. },
  200. title: {
  201. text: false,
  202. },
  203. credits:{
  204. enabled: false // 禁用版权信息
  205. },
  206. xAxis: {
  207. categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
  208. tickColor:'#1c2a38',
  209. gridLineColor: '#1c2a38',
  210. lineColor: '#1c2a38',
  211. },
  212. yAxis: {
  213. title: false,
  214. gridLineColor: '#1c2a38',
  215. tickColor:'#1c2a38'
  216. },
  217. tooltip: {
  218. },
  219. legend: {
  220. layout: 'horizontal',
  221. align: 'center',
  222. verticalAlign: 'bottom',
  223. itemStyle: { cursor: 'pointer', color: '#FFF' },
  224. itemHiddenStyle: { color: '#CCC' },
  225. },
  226. series: [{
  227. name: '全球财经',
  228. data: [1, 3, 5, 7, 9, 11, 13, 15, 17, 19, 16, 12]
  229. }, {
  230. name: '宏观经济',
  231. data: [3, 5, 7, 9, 11, 13, 15,17, 19, 18, 17, 16]
  232. }, {
  233. name: '货币市场',
  234. data: [3, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
  235. }, {
  236. name: '外汇市场',
  237. data: [10, 14,18, 22, 30, 28, 26, 24, 22, 21, 20, 19]
  238. },{
  239. name: '债券市场',
  240. data: [6, 8, 10, 13, 15,16, 18, 19, 18, 17, 16, 15]
  241. },{
  242. name: '大宗商品',
  243. data: [8, 10, 12, 14, 16, 18, 16,14,13, 12,11, 10],
  244. }]
  245. });
  246. var chart5 = $("#qst-daychart").highcharts({
  247. chart: {
  248. backgroundColor: '#1e2131',
  249. plotBorderColor: '#1c2a38',
  250. plotBorderWidth: 1
  251. },
  252. title: {
  253. text: false,
  254. },
  255. credits:{
  256. enabled: false // 禁用版权信息
  257. },
  258. xAxis: {
  259. categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
  260. tickColor:'#1c2a38',
  261. gridLineColor: '#1c2a38',
  262. lineColor: '#1c2a38',
  263. },
  264. yAxis: {
  265. title: false,
  266. gridLineColor: '#1c2a38',
  267. tickColor:'#1c2a38'
  268. },
  269. tooltip: {
  270. },
  271. legend: {
  272. layout: 'horizontal',
  273. align: 'center',
  274. verticalAlign: 'bottom',
  275. itemStyle: { cursor: 'pointer', color: '#FFF' },
  276. itemHiddenStyle: { color: '#CCC' },
  277. },
  278. series: [{
  279. name: '全球财经',
  280. data: [34, 3, 32, 7, 5, 22, 13, 15, 17, 19, 16, 12]
  281. }, {
  282. name: '宏观经济',
  283. data: [3, 5, 7, 3, 11, 13, 5,17, 0, 8, 7, 6]
  284. }, {
  285. name: '货币市场',
  286. data: [3, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
  287. }, {
  288. name: '外汇市场',
  289. data: [10, 14,18, 22, 30, 28, 26, 24, 22, 21, 20, 19]
  290. },{
  291. name: '债券市场',
  292. data: [6, 8, 10, 13, 15,16, 18, 19, 18, 17, 16, 15]
  293. },{
  294. name: '大宗商品',
  295. data: [8, 10, 12, 14, 16, 18, 16,14,13, 12,11, 10],
  296. }]
  297. });
  298. var chart6 = $("#rj-daychart").highcharts({
  299. chart: {
  300. backgroundColor: '#1e2131',
  301. plotBackgroundColor: null,
  302. plotBorderWidth: null,
  303. plotShadow: false,
  304. spacing : [20, 0 , 20, 0]
  305. },
  306. title: false,
  307. tooltip: {
  308. pointFormat: '{series.name}: <b>{point.percentage:.1f}条</b>'
  309. },
  310. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  311. },
  312. credits:{
  313. enabled: false // 禁用版权信息
  314. },
  315. plotOptions: {
  316. pie: {
  317. borderWidth: 0,
  318. allowPointSelect: true,
  319. cursor: 'pointer',
  320. dataLabels: {
  321. color:'#fff',
  322. enabled: true,
  323. format: '<b>{point.name}</b>: {point.percentage:.1f} 条',
  324. style: {
  325. color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
  326. }
  327. }
  328. }
  329. },
  330. series: [{
  331. type: 'pie',
  332. innerSize: '80%',
  333. name: '发稿数量',
  334. data: [
  335. {name:'人工', y: 45.0},
  336. {
  337. name: '机器人',
  338. y: 12.8,
  339. sliced: true,
  340. selected: true,
  341. }
  342. ]
  343. }]
  344. });
  345. var chart7 = $("#rj-monthchart").highcharts({
  346. chart: {
  347. backgroundColor: '#1e2131',
  348. plotBackgroundColor: null,
  349. plotBorderWidth: null,
  350. plotShadow: false,
  351. spacing : [20, 0 , 20, 0]
  352. },
  353. title: false,
  354. tooltip: {
  355. pointFormat: '{series.name}: <b>{point.percentage:.1f}条</b>'
  356. },
  357. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  358. },
  359. credits:{
  360. enabled: false // 禁用版权信息
  361. },
  362. plotOptions: {
  363. pie: {
  364. borderWidth: 0,
  365. allowPointSelect: true,
  366. cursor: 'pointer',
  367. dataLabels: {
  368. color:'#fff',
  369. enabled: true,
  370. format: '<b>{point.name}</b>: {point.percentage:.1f} 条',
  371. style: {
  372. color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
  373. }
  374. }
  375. }
  376. },
  377. series: [{
  378. type: 'pie',
  379. innerSize: '80%',
  380. name: '发稿数量',
  381. data: [
  382. {name:'人工', y: 70.0},
  383. {
  384. name: '机器人',
  385. y: 30.0,
  386. sliced: true,
  387. selected: true,
  388. }
  389. ]
  390. }]
  391. });
  392. var chart8 = $("#fbt-monthchart").highcharts({
  393. chart: {
  394. backgroundColor: '#1e2131',
  395. plotBackgroundColor: null,
  396. plotBorderWidth: null,
  397. plotShadow: false
  398. },
  399. title: false,
  400. tooltip: {
  401. headerFormat: '{series.name}<br>',
  402. pointFormat: '{point.name}: <b>{point.percentage:.1f}%</b>'
  403. },
  404. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  405. },
  406. credits:{
  407. enabled: false // 禁用版权信息
  408. },
  409. legend: {
  410. layout: 'horizontal',
  411. align: 'center',
  412. verticalAlign: 'bottom',
  413. itemStyle: { cursor: 'pointer', color: '#FFF' },
  414. itemHiddenStyle: { color: '#CCC' },
  415. },
  416. plotOptions: {
  417. pie: {
  418. allowPointSelect: true,
  419. cursor: 'pointer',
  420. dataLabels: {
  421. enabled: true,
  422. format: '<b>{point.name}</b>: {point.percentage:.1f} %',
  423. style: {
  424. color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || '#FFF'
  425. }
  426. }
  427. }
  428. },
  429. series: [{
  430. type: 'pie',
  431. name: '发稿量占比',
  432. data: [
  433. {
  434. name: '全球财经',
  435. y: 10,
  436. sliced: true,
  437. selected: true
  438. },
  439. ['宏观经济', 15.0],
  440. ['货币市场', 20.0],
  441. ['外汇市场', 15.0],
  442. ['债券市场', 5.0],
  443. ['大宗商品', 35.0],
  444. ]
  445. }]
  446. });
  447. var chart9 = $("#fbt-daychart").highcharts({
  448. chart: {
  449. backgroundColor: '#1e2131',
  450. plotBackgroundColor: null,
  451. plotBorderWidth: null,
  452. plotShadow: false
  453. },
  454. title: false,
  455. tooltip: {
  456. headerFormat: '{series.name}<br>',
  457. pointFormat: '{point.name}: <b>{point.percentage:.1f}%</b>'
  458. },
  459. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  460. },
  461. credits:{
  462. enabled: false // 禁用版权信息
  463. },
  464. legend: {
  465. layout: 'horizontal',
  466. align: 'center',
  467. verticalAlign: 'bottom',
  468. itemStyle: { cursor: 'pointer', color: '#FFF' },
  469. itemHiddenStyle: { color: '#CCC' },
  470. },
  471. plotOptions: {
  472. pie: {
  473. allowPointSelect: true,
  474. cursor: 'pointer',
  475. dataLabels: {
  476. enabled: true,
  477. format: '<b>{point.name}</b>: {point.percentage:.1f} %',
  478. style: {
  479. color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || '#FFF'
  480. }
  481. }
  482. }
  483. },
  484. series: [{
  485. type: 'pie',
  486. name: '发稿量占比',
  487. data: [
  488. {
  489. name: '全球财经',
  490. y: 2,
  491. sliced: true,
  492. selected: true
  493. },
  494. ['宏观经济', 30],
  495. ['货币市场', 4.0],
  496. ['外汇市场', 24.0],
  497. ['债券市场', 5.0],
  498. ['大宗商品', 5.0],
  499. ]
  500. }]
  501. });
  502. var chart10 = $("#zxlxchart").highcharts({
  503. chart: {
  504. backgroundColor: '#1e2131',
  505. type: 'column',
  506. plotBorderColor: '#1c2a38',
  507. plotBorderWidth: 1,
  508. },
  509. title:false,
  510. xAxis: {
  511. gridLineColor: '#1c2a38',//网格线
  512. tickColor:'#1c2a38',//刻度线
  513. lineColor: '#1c2a38',//轴线
  514. categories: ['宏观经济', '资本市场', '货币市场', '外汇市场', '债券市场','大宗商品']
  515. },
  516. yAxis: {
  517. min: 0,
  518. title:false,
  519. gridLineColor: '#1c2a38',//网格线
  520. tickColor:'#1c2a38',//刻度线
  521. stackLabels: {
  522. enabled: true,
  523. style: {
  524. fontWeight: 'bold',
  525. color: (Highcharts.theme && Highcharts.theme.textColor) || '#fff'
  526. }//柱形图上方数据显示
  527. }
  528. },
  529. exporting:{ enabled:false, //用来设置是否显示‘打印’,'导出'等功能按钮,不设置时默认为显示
  530. },
  531. credits:{
  532. enabled: false // 禁用版权信息
  533. },
  534. legend: {
  535. layout: 'horizontal',
  536. align: 'center',
  537. verticalAlign: 'bottom',
  538. itemStyle: { cursor: 'pointer', color: '#FFF' },
  539. itemHiddenStyle: { color: '#CCC' },
  540. },
  541. tooltip: {
  542. formatter: function () {
  543. return '<b>' + this.x + '</b><br/>' +
  544. this.series.name + ': ' + this.y + '<br/>' +
  545. '总量: ' + this.point.stackTotal;
  546. }
  547. },
  548. plotOptions: {
  549. column: { //不显示阴影
  550. stacking: 'normal',
  551. bar: false,
  552. borderWidth: 0, //柱子边框的大小
  553. },
  554. },
  555. series: [{
  556. name: '要闻',
  557. data: [15, 3, 24, 7, 2,4]
  558. }, {
  559. name: '快讯',
  560. data: [12, 2, 23, 2, 1,7]
  561. }, {
  562. name: '资讯',
  563. data: [13, 4,24, 2, 5,3]
  564. }]
  565. });
  566. });