HighCharts HighStocks事件标志被图表边框遮挡

时间:2013-01-02 16:00:44

标签: jquery highcharts highstock

如果您在图表日期的最后一个日期有一个带有事件标记标记的数据点,则很难查看,因为它被推到图表的绝对最右边。有没有办法为这种情况增加图表的空间?以下是来自highstocks网站示例演示的一些改编的小提琴代码,其中图表中的最终记录标记为“A”,说明了这个问题......

$(function(){     $ .getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?',function(data){

    // Create the chart
    window.chart = new Highcharts.StockChart({
        chart : {
            renderTo : 'container'
        },

        rangeSelector : {
            selected : 1
        },

        title : {
            text : 'USD to EUR exchange rate'
        },

        tooltip: {
            style: {
                width: '200px'
            },
            valueDecimals: 4
        },

        yAxis : {
            title : {
                text : 'Exchange rate'
            }
        },

        series : [{
            name : 'USD to EUR',
            data : data,
            id : 'dataseries'
        },
        // the event marker flags
        {
            type : 'flags',
            data : [{
                x : Date.UTC(2011, 3, 25),
                title : 'H',
                text : 'Euro Contained by Channel Resistance'
            }, {
                x : Date.UTC(2011, 3, 28),
                title : 'G',
                text : 'EURUSD: Bulls Clear Path to 1.50 Figure'
            }, {
                x : Date.UTC(2011, 4, 4),
                title : 'F',
                text : 'EURUSD: Rate Decision to End Standstill'
            }, {
                x : Date.UTC(2011, 4, 5),
                title : 'E',
                text : 'EURUSD: Enter Short on Channel Break'
            }, {
                x : Date.UTC(2011, 4, 6),
                title : 'D',
                text : 'Forex: U.S. Non-Farm Payrolls Expand 244K, U.S. Dollar Rally Cut Short By Risk Appetite'
            }, {
                x : Date.UTC(2011, 4, 6),
                title : 'C',
                text : 'US Dollar: Is This the Long-Awaited Recovery or a Temporary Bounce?'
            }, {
                x : Date.UTC(2011, 4, 9),
                title : 'B',
                text : 'EURUSD: Bearish Trend Change on Tap?'
            },
            {
                x : Date.UTC(2011, 4, 10),
                title : 'A',
                text : 'Test Flag Falling off the chart'                            
            }],
            onSeries : 'dataseries',
            shape : 'circlepin',
            width : 16
        }]
    });
});

});

2 个答案:

答案 0 :(得分:1)

不幸的是不可能。有关切割标志的问题,请在此处报告:https://github.com/highslide-software/highcharts.com/issues/419

答案 1 :(得分:0)

以下代码可解决此问题:

UIView.animate(withDuration: 0.2, delay: 0, options: .curveEaseInOut, animations: {
    let rotationAngle: CGFloat = val ? .pi : (-.pi * 2)
    self.iv.transform = .init(rotationAngle: rotationAngle)
}, completion: nil)