candlestickseries.js

candlestickseries.js

    YUI({
        defaultGraphicEngine: (window.location.search.match(/[?&]defaultGraphicEngine=([^&]+)/) || [])[1] || 'svg',
		filter: (window.location.search.match(/[?&]filter=([^&]+)/) || [])[1] || 'raw'
    }).use('axis-numeric-base', 'axis-category-base', 'series-candlestick', function (Y) 
    { 
        var myDataValues = [ 
            {date:"5/1/2010", open:2000, high:3700, low:200, close: 2300}, 
            {date:"5/2/2010", open:1500, high:9100, low:100, close: 500}, 
            {date:"5/3/2010", open:400, high:3100, low:1500, close: 2000}, 
            {date:"5/4/2010", open:3200, high:3900, low:2800, close: 2900}, 
            {date:"5/5/2010", open:5000, high:5300, low:2650, close:2700},
            {date:"5/6/2010", open:2000, high:3700, low:2200, close: 2300}, 
            {date:"5/7/2010", open:1500, high:9100, low:100, close: 500}, 
            {date:"5/8/2010", open:2000, high:3100, low:1500, close: 2500}, 
            {date:"5/9/2010", open:3000, high:3900, low:2800, close: 2900}, 
            {date:"5/10/2010", open:5000, high:5300, low:2650, close:2700},
            {date:"5/11/2010", open:2000, high:3700, low:200, close: 2300}, 
            {date:"5/12/2010", open:1500, high:9100, low:100, close: 500}, 
            {date:"5/13/2010", open:400, high:3100, low:1500, close: 2000}, 
            {date:"5/14/2010", open:3200, high:3900, low:2800, close: 2900}, 
            {date:"5/15/2010", open:5000, high:5300, low:2650, close:2700},
            {date:"5/16/2010", open:2000, high:3700, low:2200, close: 2300}, 
            {date:"5/17/2010", open:1500, high:9100, low:100, close: 500}, 
            {date:"5/18/2010", open:2000, high:3100, low:1500, close: 2500}, 
            {date:"5/19/2010", open:3000, high:3900, low:2800, close: 2900}, 
            {date:"5/20/2010", open:5000, high:5300, low:2650, close:2700}
        ];
        
        var graphic = new Y.Graphic({
            render: "#mychart",
            autoDraw: false
        });
        var numaxis = new Y.NumericAxisBase({
            dataProvider: myDataValues,
            keys: ['open', 'high', 'low', 'close']
        });
        var cataxis = new Y.CategoryAxisBase({
            dataProvider: myDataValues,
            keys: ['date']
        });

        var chart = new Y.CandlestickSeries({
            graphic: graphic,
            yAxis: numaxis,
            yKey: ['open', 'high', 'low', 'close'],
            xAxis: cataxis,
            xKey: "date"
        });
        chart.draw();
        graphic._redraw();
    });