如何设置 stock 图表的高度？

nmgwddj

像下图中四个图表，非常紧凑，我曾尝试设置 yAxis 的 height 参数，图标是缩短了，但辅助线还是在原来的位置。我希望高度可以控制。


我修改后的效果：



代码：

1. $(function () {
   
2.     Highcharts.setOptions({
   
3.         lang: {
   
4.             rangeSelectorZoom: ''
   
5.         }
   
6.     });
   
7.     $.getJSON('https://data.jianshukeji.com/jsonp?filename=json/aapl-ohlcv.json&callback=?', function (data) {
   
8.         var ohlc = [],
   
9.             volume = [],
   
10.             dataLength = data.length,
    
11.             // set the allowed units for data grouping
    
12.             groupingUnits = [[
    
13.                 'week',                         // unit name
    
14.                 [1]                             // allowed multiples
    
15.             ], [
    
16.                 'month',
    
17.                 [1, 2, 3, 4, 6]
    
18.             ]],
    
19.             i = 0;
    
20.         for (i; i < dataLength; i += 1) {
    
21.             ohlc.push([
    
22.                 data[i][0], // the date
    
23.                 data[i][1], // open
    
24.                 data[i][2], // high
    
25.                 data[i][3], // low
    
26.                 data[i][4] // close
    
27.             ]);
    
28.             volume.push([
    
29.                 data[i][0], // the date
    
30.                 data[i][5] // the volume
    
31.             ]);
    
32.         }
    
33.         // create the chart
    
34.         $('#container').highcharts('StockChart', {
    
35.             rangeSelector: {
    
36.                 enabled: false
    
37.             },
    
38.             xAxis: {
    
39.                 dateTimeLabelFormats: {
    
40.                     millisecond: '%H:%M:%S.%L',
    
41.                     second: '%H:%M:%S',
    
42.                     minute: '%H:%M',
    
43.                     hour: '%H:%M',
    
44.                     day: '%m-%d',
    
45.                     week: '%m-%d',
    
46.                     month: '%y-%m',
    
47.                     year: '%Y'
    
48.                 }
    
49.             },
    
50.             yAxis: [{
    
51.                 labels: {
    
52.                     align: 'right',
    
53.                     x: -3
    
54.                 },
    
55.                 height: '30%',
    
56.                 lineWidth: 2
    
57.             }, {
    
58.                 labels: {
    
59.                     align: 'right',
    
60.                     x: -3
    
61.                 },
    
62.                 top: '30%',
    
63.                 height: '35%',
    
64.                 offset: 0,
    
65.                 lineWidth: 2
    
66.             }],
    
67.             series: [{
    
68.                 type: 'line',
    
69.                 name: 'AAPL',
    
70.                 data: ohlc,
    
71.                 dataGrouping: {
    
72.                     units: groupingUnits
    
73.                 }
    
74.             }, {
    
75.                 type: 'column',
    
76.                 name: 'Volume',
    
77.                 data: volume,
    
78.                 yAxis: 1,
    
79.                 dataGrouping: {
    
80.                     units: groupingUnits
    
81.                 }
    
82.             }],
    
83.             scrollbar: {
    
84.                 enabled: false
    
85.             },
    
86.             navigator: {
    
87.                 enabled: false
    
88.             }
    
89.         });
    
90.     });
    
91. });
    

复制代码

nmgwddj

问题已经解决，配置 chart 中的 height 即可设定高度。