ECharts Bar chart

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no" />
 6         <title></title>
 7     </head>
 8     <body>
 9         <div id="echarts_bar" style="width: 100vw; height:400px;"></div>
10         
11     </body>
12     <!-- <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> -->
13     <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
14     <script type="text/javascript">
15         var myChart = echarts.init(document.getElementById("echarts_bar"));
16 
17         option = {
 18 is              XAXIS: {
 . 19                  AxisLabel: {
 20 is                      // Inside: to true, // coordinate values into the outer table (the default is to false) 
21 is                      textStyle: {
 22 is                          Color: ' Red ' 
23 is                      }
 24                  },
 25                  / * axis - start * / 
26 is                  axisTick: {
 27                      Show: to false 
28                  },
 29                  axisLine: {
 30                      Show: to false 
31 is                 }
 32                  / * axis - End * / 
33 is                  type: ' category ' ,
 34 is                  Data: [ " Sunday " , " Monday " , " Tuesday " , " Wednesday " , " Thursday " , " Friday " , ' Saturday ' ]
 35              },
 36              YAXIS: {
 37 [                  AxisLabel: {
 38 is                     textStyle: {
39                         color: 'red'
40                     }
41                 },
42                 axisTick: {
43                     show: false
44                 },
45                 axisLine: {
46                     show: false
47                 },
48                 type: 'value'
49             },
50             series: [{
51                 data: [120, 200, 150, 80, 10, 110, 130],
52                 type: 'bar',
53                 itemStyle: {
54                     normal: {
55                         color: new echarts.graphic.LinearGradient(
56                             0, 0, 0, 1,
57                             [
58                                 {offset: 0, color: '#00FEFC'},
59                                 {offset: 0.3, color: '#00AFFF'},
60                                 {offset: 0.6, color: '#007DF2'},
61                                 {offset: 1, color: '#1E5FCE'}
62                             ]
63                         )
64                     }
65                 },
66                 markPoint: {
67                     Data: [
 68                          {type: ' max ' , name: ' maximum ' },
 69                          {type: ' min ' , name: ' minimum ' }
 70                      ]
 71 is                  }
 72              }]
 73 is          };
 74          
75          myChart.setOption ( Option);
 76      </ Script > 
77  </ HTML >
Guess you like
