keji4.html 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="en">
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <link type="text/css" href="${contextPath}/WebPages_170421/css/keji/keji.css" rel="stylesheet">
  7. <link href="${contextPath}/WebPages_170421/css/bootstrap/bootstrap.min.css" rel="stylesheet">
  8. <script type="text/javascript" src="${contextPath}/WebPages_170421/${contextPath}/WebPages_170421/jquery.js"></script>
  9. <script src="${contextPath}/WebPages_170421/js/bootstrap.min.js"></script>
  10. <script src="${contextPath}/WebPages_170421/js/echarts.js"></script>
  11. </head>
  12. <body>
  13. <div class="head">
  14. <p class="tit">吉林省科技创新创业资源公共服务平台</p>
  15. <p class="tit1">科技数据展示</p>
  16. <p class="tit2"><a href="javascript:history.go(-1);">返回首页</a></p>
  17. </div>
  18. <div class="container">
  19. <div id="main" style="margin-top:20px;">
  20. <script type="text/javascript">
  21. // 基于准备好的dom,初始化echarts实例
  22. var myChart = echarts.init(document.getElementById('main'));
  23. option = {
  24. // backgroundColor: new echarts.graphic.RadialGradient(0.3, 0.3, 0.8, [{
  25. // offset: 0,
  26. // color: 'red'
  27. // }, {
  28. // offset: 1,
  29. // color: 'green'
  30. // }]),
  31. title : {
  32. text: '合同登记数据展示合同登记数据展示',
  33. // top:'bottom',
  34. // left:'center',
  35. textStyle: {
  36. color: '#fff',
  37. fontSize:20
  38. },
  39. subtext: '来源:吉林省科技厅',
  40. // x:'center',
  41. subtextStyle: {
  42. color: '#fff'
  43. }
  44. },
  45. color: ['#3398DB'],
  46. tooltip: {
  47. trigger: 'axis',
  48. axisPointer: { // 坐标轴指示器,坐标轴触发有效
  49. type: 'line' // 默认为直线,可选为:'line' | 'shadow'
  50. }
  51. },
  52. legend: {
  53. orient: 'vertical',
  54. left: '800px',
  55. top:'10',
  56. // itemGap:25,
  57. textStyle: {
  58. color: '#fff'
  59. },
  60. // x : 'center',
  61. // y : '650px',
  62. data: ['直接访问']
  63. },
  64. grid: {
  65. left: '3%',
  66. right: '4%',
  67. bottom: '3%',
  68. containLabel: true
  69. },
  70. xAxis: [{
  71. type: 'category',
  72. data: ['绿园区', '宽城区宽', '朝阳区', '二道', 'Fri', 'Sat', 'Sun'],
  73. axisTick: {
  74. alignWithLabel: true
  75. },
  76. axisLine: {
  77. lineStyle: {
  78. color: '#ffffff'
  79. }
  80. }
  81. }],
  82. yAxis: [{
  83. type: 'value',
  84. axisTick: {
  85. alignWithLabel: true
  86. },
  87. axisLine: {
  88. lineStyle: {
  89. color: '#ffffff'
  90. }
  91. }
  92. }],
  93. series: [{
  94. name: '直接访问',
  95. type: 'bar',
  96. // center: ['50%', '90%'],
  97. barWidth: '60%',
  98. data: [10, 52, 200, 334, 1290, 330, 220]
  99. }]
  100. };
  101. myChart.setOption(option);
  102. </script>
  103. </div>
  104. </div>
  105. </body>
  106. </html>