0

我希望能够绘制一个图表数据,该数据具有通常的开盘高低和收盘价以及交易量和未平仓量。这些将在 3 个窗格中表示: 窗格 1:开高低 关闭窗格 2:卷 窗格 3:未平仓合约。

HighCharts (highStock) 中的“两个窗格、烛台和交易量”示例仅处理窗格 1 和 2。所以问题是是否可以在“交易量”窗格下绘制第三个窗格,我可以在其中拥有未平仓合约栏?谢谢

4

2 回答 2

0

是的,这是可能的 - 只需像您提到的示例中那样添加更多轴。

于 2013-07-25T09:54:11.353 回答
0

我也试图在 highstock 中有 3 个或更多窗格,但面临滚动条问题。滚动条仅与第一个图表同步,与两个图表的其余部分不同步。代码如下:

$(function () {
$('#container').highcharts('StockChart', {



        rangeSelector : {
                buttons : [],
                inputEnabled : false
            },credits : {
                enabled : false
            },tooltip: {
                formatter: function () {
                        var series = this.series;
                        if(null != series){
                            if(null != this.point.custom){
                                return Highcharts.dateFormat('%A %b %d %H:%M:%S',
                                        new Date(this.x)) + '<br> ' + "<b> Alarm Criticality : </b>" +this.point.custom;
                            }                   

                            return Highcharts.dateFormat('%A %b %d %H:%M:%S',
                                    new Date(this.x)) + '<br> ' + "<b> Severity : </b>" +this.y;                        
                        }else {
                            return Highcharts.dateFormat('%A %b %d %H:%M:%S',
                                    new Date(this.x)) + '<br> ' + "<b> Health : </b>" +this.y;      
                        }
                    }
                },

            yAxis: [
                  {
                    opposite : false,
                    min: 10,                       
                    labels: {
                         enabled: false
                     },
                    title: {
                        text: 'Alarm'
                    },
                    top: 0,
                    height: '25%',
                    offset: 0,
                    lineWidth: 2
                },{
                    opposite : false,
                    min: 0,
                    //max: 100,
                    labels: {
                        align: 'left',
                        x: -5
                    },
                    title: {
                        text: 'Health'
                    },
                    top: '15%',
                    height: '25%',
                    offset: 0,
                    lineWidth: 2
                },{
                    opposite : false,
                    min: 0,
                    max:10,
                    labels: {
                        align: 'left',
                        x: -5
                    },
                    title: {
                        text: 'Anomaly Score'
                    },
                    top: '50%',
                    height: '25%',
                    offset: 0,
                    lineWidth: 2
                }
            ],

            series: [
               {
                type: 'scatter',
                name: 'Alarm',
                cursor: 'pointer',
                id: 'alarm',
                data: data :[someData],
                 turboThreshold: 3600,
                yAxis: 0                        

            },{
                name : 'Health',
                data :[someData], 
                yAxis: 1,
                type : 'areaspline',
                id: "health",
                fillColor : {
                    linearGradient : {
                        x1 : 0,
                        y1 : 0,
                        x2 : 0,
                        y2 : 1
                    },
                    stops : [
                            [
                                    0, Highcharts.getOptions().colors[ 0 ]
                            ], [
                                    1, Highcharts.Color( Highcharts.getOptions().colors[ 0 ] ).setOpacity( 0 ).get( 'rgba' )
                            ]
                    ]
                }
            },{
                type: 'scatter',
                name: 'Anomaly Score',
                data: data :[someData],
                yAxis: 2,
                id : 'anomalies',
                lineWidth : 0,
                marker : {
                    enabled : true,
                    radius : 4, 
                    symbol: 'circle',
                    fillColor:'#8EBCEB'                      
                }                

            }  
            ]


});

});

于 2015-01-27T04:59:27.430 回答