extjs-gpl
Version:
GPL licensed version of Sencha Ext JS
131 lines (127 loc) • 3.93 kB
JavaScript
/**
* @class Ext.chart.series.CandleStick
* @extends Ext.chart.series.Cartesian
*
* Creates a candlestick or OHLC Chart.
*
* @example
* Ext.create({
* xtype: 'cartesian',
* renderTo: document.body,
* width: 600,
* height: 400,
* insetPadding: 40,
* store: {
* fields: ['time', 'open', 'high', 'low', 'close'],
* data: [{
* 'time': new Date('Jan 1 2010').getTime(),
* 'open': 600,
* 'high': 614,
* 'low': 578,
* 'close': 590
* }, {
* 'time': new Date('Jan 2 2010').getTime(),
* 'open': 590,
* 'high': 609,
* 'low': 580,
* 'close': 580
* }, {
* 'time': new Date('Jan 3 2010').getTime(),
* 'open': 580,
* 'high': 602,
* 'low': 578,
* 'close': 602
* }, {
* 'time': new Date('Jan 4 2010').getTime(),
* 'open': 602,
* 'high': 614,
* 'low': 586,
* 'close': 586
* }, {
* 'time': new Date('Jan 5 2010').getTime(),
* 'open': 586,
* 'high': 602,
* 'low': 565,
* 'close': 565
* }]
* },
* axes: [{
* type: 'numeric',
* position: 'left',
* fields: ['open', 'high', 'low', 'close'],
* title: {
* text: 'Sample Values',
* fontSize: 15
* },
* grid: true,
* minimum: 560,
* maximum: 640
* }, {
* type: 'time',
* position: 'bottom',
* fields: ['time'],
* fromDate: new Date('Dec 31 2009'),
* toDate: new Date('Jan 6 2010'),
* title: {
* text: 'Sample Values',
* fontSize: 15
* },
* style: {
* axisLine: false
* }
* }],
* series: {
* type: 'candlestick',
* xField: 'time',
* openField: 'open',
* highField: 'high',
* lowField: 'low',
* closeField: 'close',
* style: {
* dropStyle: {
* fill: 'rgb(222, 87, 87)',
* stroke: 'rgb(222, 87, 87)',
* lineWidth: 3
* },
* raiseStyle: {
* fill: 'rgb(48, 189, 167)',
* stroke: 'rgb(48, 189, 167)',
* lineWidth: 3
* }
* }
* }
* });
*/
Ext.define('Ext.chart.series.CandleStick', {
extend: 'Ext.chart.series.Cartesian',
requires: ['Ext.chart.series.sprite.CandleStick'],
alias: 'series.candlestick',
type: 'candlestick',
seriesType: 'candlestickSeries',
config: {
/**
* @cfg {String} openField
* The store record field name that represents the opening value of the given period.
*/
openField: null,
/**
* @cfg {String} highField
* The store record field name that represents the highest value of the time interval represented.
*/
highField: null,
/**
* @cfg {String} lowField
* The store record field name that represents the lowest value of the time interval represented.
*/
lowField: null,
/**
* @cfg {String} closeField
* The store record field name that represents the closing value of the given period.
*/
closeField: null
},
fieldCategoryY: ['Open', 'High', 'Low', 'Close'],
themeColorCount: function() {
return 2;
}
});