Feel free to share demo-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Backend API
import React from 'react';
import DataGrid, {
Column,
Sorting,
Paging,
Pager,
} from 'devextreme-react/data-grid';
import { weekData } from './data.ts';
import DiffCell from './DiffCell.tsx';
import ChartCell from './ChartCell.tsx';
const App = () => (
<DataGrid id="gridContainer"
dataSource={weekData}
keyExpr="date"
showRowLines={true}
showColumnLines={false}
showBorders={true}>
<Sorting mode="none" />
<Paging defaultPageSize={10} />
<Pager visible={true} />
<Column dataField="date" width={110} dataType="date" />
<Column caption="Open" cellRender={DiffCell} />
<Column caption="Close" cellRender={DiffCell} />
<Column caption="Dynamics" minWidth={320} cellRender={ChartCell} />
<Column caption="High" cellRender={DiffCell} />
<Column caption="Low" cellRender={DiffCell} />
</DataGrid>
);
export default App;
import React from 'react';
import DataGrid, {
Column, Sorting, Paging, Pager,
} from 'devextreme-react/data-grid';
import { weekData } from './data.js';
import DiffCell from './DiffCell.js';
import ChartCell from './ChartCell.js';
const App = () => (
<DataGrid
id="gridContainer"
dataSource={weekData}
keyExpr="date"
showRowLines={true}
showColumnLines={false}
showBorders={true}
>
<Sorting mode="none" />
<Paging defaultPageSize={10} />
<Pager visible={true} />
<Column
dataField="date"
width={110}
dataType="date"
/>
<Column
caption="Open"
cellRender={DiffCell}
/>
<Column
caption="Close"
cellRender={DiffCell}
/>
<Column
caption="Dynamics"
minWidth={320}
cellRender={ChartCell}
/>
<Column
caption="High"
cellRender={DiffCell}
/>
<Column
caption="Low"
cellRender={DiffCell}
/>
</DataGrid>
);
export default App;
import React from 'react';
import Sparkline, { Size, Tooltip } from 'devextreme-react/sparkline';
import { DataGridTypes } from 'devextreme-react/data-grid';
const ChartCell = (cellData: DataGridTypes.ColumnCellTemplateData) => (
<div className="chart-cell">
<Sparkline
dataSource={cellData.data.dayClose}
argumentField="date"
valueField="close"
type="line"
showMinMax={true}
minColor="#f00"
maxColor="#2ab71b"
pointSize={6}>
<Size width={290} height={40} />
<Tooltip enabled={false} />
</Sparkline>
</div>
);
export default ChartCell;
import React from 'react';
import 'devextreme/localization/globalize/currency';
import { formatNumber } from 'devextreme/localization';
import { DataGridTypes } from 'devextreme-react/data-grid';
const getGridCellData = (gridData: DataGridTypes.ColumnCellTemplateData) => gridData.data[gridData.column.caption.toLowerCase()];
const DiffCell = (cellData: DataGridTypes.ColumnCellTemplateData) => {
const gridCellData = getGridCellData(cellData);
return (
<div className={gridCellData.diff > 0 ? 'inc' : 'dec'}>
<div className="current-value">{formatNumber(gridCellData.value, { type: 'currency', currency: 'USD', precision: 2 })}</div>
<div className="diff">{Math.abs(gridCellData.diff).toFixed(2)}</div>
</div>
);
};
export default DiffCell;
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.tsx';
ReactDOM.render(
<App />,
document.getElementById('app'),
);
export const weekData = [{
date: new Date('2013/12/23'),
open: {
value: 3563.19,
diff: 92.76,
},
high: {
value: 3591.31,
diff: 50.34,
},
low: {
value: 3552.3,
diff: 129.44,
},
close: {
value: 3574.02,
diff: 42.83,
},
volume: 1254340000,
adjClose: 3574.02,
dayClose: [{
close: 3569.4,
date: new Date('2013/12/23'),
}, {
close: 3572.8,
date: new Date('2013/12/24'),
}, {
close: 3584.58,
date: new Date('2013/12/26'),
}, {
close: 3574.02,
date: new Date('2013/12/27'),
}],
}, {
date: new Date('2013/12/16'),
open: {
value: 3470.43,
diff: -45.24,
},
high: {
value: 3540.97,
diff: 16.96,
},
low: {
value: 3422.86,
diff: -26.88,
},
close: {
value: 3531.19,
diff: 74.79,
},
volume: 2261352000,
adjClose: 3531.19,
dayClose: [{
close: 3475.79,
date: new Date('2013/12/16'),
}, {
close: 3469.32,
date: new Date('2013/12/17'),
}, {
close: 3509.63,
date: new Date('2013/12/18'),
}, {
close: 3498.63,
date: new Date('2013/12/19'),
}, {
close: 3531.19,
date: new Date('2013/12/20'),
}],
}, {
date: new Date('2013/12/09'),
open: {
value: 3515.67,
diff: 19.48,
},
high: {
value: 3524.01,
diff: 12.91,
},
low: {
value: 3449.74,
diff: -3.48,
},
close: {
value: 3456.4,
diff: -47.86,
},
volume: 1802822000,
adjClose: 3456.4,
dayClose: [{
close: 3516.17,
date: new Date('2013/12/09'),
}, {
close: 3514.2,
date: new Date('2013/12/10'),
}, {
close: 3468.99,
date: new Date('2013/12/11'),
}, {
close: 3460.29,
date: new Date('2013/12/12'),
}, {
close: 3456.4,
date: new Date('2013/12/13'),
}],
}, {
date: new Date('2013/12/02'),
open: {
value: 3496.19,
diff: 62.27,
},
high: {
value: 3511.1,
diff: 15.13,
},
low: {
value: 3453.22,
diff: 32.86,
},
close: {
value: 3504.26,
diff: 16.44,
},
volume: 1810088000,
adjClose: 3504.26,
dayClose: [{
close: 3481.15,
date: new Date('2013/12/02'),
}, {
close: 3479.34,
date: new Date('2013/12/03'),
}, {
close: 3483.01,
date: new Date('2013/12/04'),
}, {
close: 3477.73,
date: new Date('2013/12/05'),
}, {
close: 3504.26,
date: new Date('2013/12/06'),
}],
}, {
date: new Date('2013/11/25'),
open: {
value: 3433.92,
diff: 10.45,
},
high: {
value: 3495.97,
diff: 66.77,
},
low: {
value: 3420.36,
diff: 61.05,
},
close: {
value: 3487.82,
diff: 65.8,
},
volume: 1508490000,
adjClose: 3487.82,
dayClose: [{
close: 3427.49,
date: new Date('2013/11/25'),
}, {
close: 3445.76,
date: new Date('2013/11/26'),
}, {
close: 3470.48,
date: new Date('2013/11/27'),
}, {
close: 3487.82,
date: new Date('2013/11/29'),
}],
}, {
date: new Date('2013/11/18'),
open: {
value: 3423.47,
diff: 63.64,
},
high: {
value: 3429.2,
diff: 6.62,
},
low: {
value: 3359.31,
diff: 12.9,
},
close: {
value: 3422.02,
diff: -0.56,
},
volume: 1742680000,
adjClose: 3422.02,
dayClose: [{
close: 3388.87,
date: new Date('2013/11/18'),
}, {
close: 3378.13,
date: new Date('2013/11/19'),
}, {
close: 3367.17,
date: new Date('2013/11/20'),
}, {
close: 3402.74,
date: new Date('2013/11/21'),
}, {
close: 3422.02,
date: new Date('2013/11/22'),
}],
}, {
date: new Date('2013/11/11'),
open: {
value: 3359.83,
diff: -28.87,
},
high: {
value: 3422.58,
diff: 21.31,
},
low: {
value: 3346.41,
diff: 28.01,
},
close: {
value: 3422.58,
diff: 55.74,
},
volume: 1812784000,
adjClose: 3422.58,
dayClose: [{
close: 3362.98,
date: new Date('2013/11/11'),
}, {
close: 3365.23,
date: new Date('2013/11/12'),
}, {
close: 3405.56,
date: new Date('2013/11/13'),
}, {
close: 3415.14,
date: new Date('2013/11/14'),
}, {
close: 3422.58,
date: new Date('2013/11/15'),
}],
}, {
date: new Date('2013/11/04'),
open: {
value: 3388.7,
diff: 6.52,
},
high: {
value: 3401.27,
diff: -7.01,
},
low: {
value: 3318.4,
diff: -46.25,
},
close: {
value: 3366.84,
diff: -12.92,
},
volume: 2011546000,
adjClose: 3366.84,
dayClose: [{
close: 3384.75,
date: new Date('2013/11/04'),
}, {
close: 3388.82,
date: new Date('2013/11/05'),
}, {
close: 3385.38,
date: new Date('2013/11/06'),
}, {
close: 3321.41,
date: new Date('2013/11/07'),
}, {
close: 3366.84,
date: new Date('2013/11/08'),
}],
}, {
date: new Date('2013/10/28'),
open: {
value: 3382.18,
diff: 20.42,
},
high: {
value: 3408.28,
diff: 8.24,
},
low: {
value: 3364.65,
diff: 34.45,
},
close: {
value: 3379.76,
diff: -4.07,
},
volume: 1962860000,
adjClose: 3379.76,
dayClose: [{
close: 3382.68,
date: new Date('2013/10/28'),
}, {
close: 3391.75,
date: new Date('2013/10/29'),
}, {
close: 3385.38,
date: new Date('2013/10/30'),
}, {
close: 3377.73,
date: new Date('2013/10/31'),
}, {
close: 3379.76,
date: new Date('2013/11/01'),
}],
}, {
date: new Date('2013/10/21'),
open: {
value: 3361.76,
diff: 148.38,
},
high: {
value: 3400.04,
diff: 44.41,
},
low: {
value: 3330.2,
diff: 118.15,
},
close: {
value: 3383.83,
diff: 29.95,
},
volume: 1952026000,
adjClose: 3383.83,
dayClose: [{
close: 3361.18,
date: new Date('2013/10/21'),
}, {
close: 3366.93,
date: new Date('2013/10/22'),
}, {
close: 3346.05,
date: new Date('2013/10/23'),
}, {
close: 3362.38,
date: new Date('2013/10/24'),
}, {
close: 3383.83,
date: new Date('2013/10/25'),
}],
}, {
date: new Date('2013/10/14'),
open: {
value: 3213.38,
diff: -2.39,
},
high: {
value: 3355.63,
diff: 115.52,
},
low: {
value: 3212.05,
diff: 94.36,
},
close: {
value: 3353.88,
diff: 120.05,
},
volume: 1772590000,
adjClose: 3353.88,
dayClose: [{
close: 3256.02,
date: new Date('2013/10/14'),
}, {
close: 3244.66,
date: new Date('2013/10/15'),
}, {
close: 3281.67,
date: new Date('2013/10/16'),
}, {
close: 3301.28,
date: new Date('2013/10/17'),
}, {
close: 3353.88,
date: new Date('2013/10/18'),
}],
}, {
date: new Date('2013/10/07'),
open: {
value: 3215.77,
diff: 25.37,
},
high: {
value: 3240.11,
diff: -16.6,
},
low: {
value: 3117.69,
diff: -69.17,
},
close: {
value: 3233.83,
diff: -8.74,
},
volume: 1891806000,
adjClose: 3233.83,
dayClose: [{
close: 3215.69,
date: new Date('2013/10/07'),
}, {
close: 3153.87,
date: new Date('2013/10/08'),
}, {
close: 3142.54,
date: new Date('2013/10/09'),
}, {
close: 3210.84,
date: new Date('2013/10/10'),
}, {
close: 3233.83,
date: new Date('2013/10/11'),
}],
}, {
date: new Date('2013/09/30'),
open: {
value: 3190.4,
diff: -51.92,
},
high: {
value: 3256.71,
diff: 13.28,
},
low: {
value: 3186.86,
diff: -15.89,
},
close: {
value: 3242.57,
diff: 12.27,
},
volume: 1793200000,
adjClose: 3242.57,
dayClose: [{
close: 3218.2,
date: new Date('2013/09/30'),
}, {
close: 3253.05,
date: new Date('2013/10/01'),
}, {
close: 3253.26,
date: new Date('2013/10/02'),
}, {
close: 3213.83,
date: new Date('2013/10/03'),
}, {
close: 3242.57,
date: new Date('2013/10/04'),
}],
}, {
date: new Date('2013/09/23'),
open: {
value: 3242.32,
diff: 39.13,
},
high: {
value: 3243.43,
diff: -5.09,
},
low: {
value: 3202.75,
diff: 39.62,
},
close: {
value: 3230.3,
diff: 5.57,
},
volume: 1775808000,
adjClose: 3230.3,
dayClose: [{
close: 3219.34,
date: new Date('2013/09/23'),
}, {
close: 3218.66,
date: new Date('2013/09/24'),
}, {
close: 3208.55,
date: new Date('2013/09/25'),
}, {
close: 3234.04,
date: new Date('2013/09/26'),
}, {
close: 3230.3,
date: new Date('2013/09/27'),
}],
}, {
date: new Date('2013/09/16'),
open: {
value: 3203.19,
diff: 57.17,
},
high: {
value: 3248.52,
diff: 59.28,
},
low: {
value: 3163.13,
diff: 17.11,
},
close: {
value: 3224.73,
diff: 46.45,
},
volume: 1839474000,
adjClose: 3224.73,
dayClose: [{
close: 3168.69,
date: new Date('2013/09/16'),
}, {
close: 3190.83,
date: new Date('2013/09/17'),
}, {
close: 3231.31,
date: new Date('2013/09/18'),
}, {
close: 3237.61,
date: new Date('2013/09/19'),
}, {
close: 3224.73,
date: new Date('2013/09/20'),
}],
}, {
date: new Date('2013/09/09'),
open: {
value: 3146.02,
diff: 48.37,
},
high: {
value: 3189.24,
diff: 40.25,
},
low: {
value: 3146.02,
diff: 68.89,
},
close: {
value: 3178.28,
diff: 44.9,
},
volume: 1668658000,
adjClose: 3178.28,
dayClose: [{
close: 3169.93,
date: new Date('2013/09/09'),
}, {
close: 3185.07,
date: new Date('2013/09/10'),
}, {
close: 3179.86,
date: new Date('2013/09/11'),
}, {
close: 3175.57,
date: new Date('2013/09/12'),
}, {
close: 3178.28,
date: new Date('2013/09/13'),
}],
}, {
date: new Date('2013/09/03'),
open: {
value: 3097.65,
diff: -29.36,
},
high: {
value: 3148.99,
diff: 1.12,
},
low: {
value: 3077.13,
diff: 23.87,
},
close: {
value: 3133.38,
diff: 59.57,
},
volume: 1670570000,
adjClose: 3133.38,
dayClose: [{
close: 3091.76,
date: new Date('2013/09/03'),
}, {
close: 3124.54,
date: new Date('2013/09/04'),
}, {
close: 3129.94,
date: new Date('2013/09/05'),
}, {
close: 3133.38,
date: new Date('2013/09/06'),
}],
}, {
date: new Date('2013/08/26'),
open: {
value: 3127.01,
diff: 52.63,
},
high: {
value: 3147.87,
diff: 20.82,
},
low: {
value: 3053.26,
diff: -8.16,
},
close: {
value: 3073.81,
diff: -50.46,
},
volume: 1417628000,
adjClose: 3073.81,
dayClose: [{
close: 3122.67,
date: new Date('2013/08/26'),
}, {
close: 3059.58,
date: new Date('2013/08/27'),
}, {
close: 3072.17,
date: new Date('2013/08/28'),
}, {
close: 3093.36,
date: new Date('2013/08/29'),
}, {
close: 3073.81,
date: new Date('2013/08/30'),
}],
}, {
date: new Date('2013/08/19'),
open: {
value: 3074.38,
diff: -32.68,
},
high: {
value: 3127.05,
diff: -22.19,
},
low: {
value: 3061.42,
diff: -6.65,
},
close: {
value: 3124.27,
diff: 50.36,
},
volume: 1305026000,
adjClose: 3124.27,
dayClose: [{
close: 3069.76,
date: new Date('2013/08/19'),
}, {
close: 3082.17,
date: new Date('2013/08/20'),
}, {
close: 3071.47,
date: new Date('2013/08/21'),
}, {
close: 3101.82,
date: new Date('2013/08/22'),
}, {
close: 3124.27,
date: new Date('2013/08/23'),
}],
}, {
date: new Date('2013/08/12'),
open: {
value: 3107.06,
diff: -29.71,
},
high: {
value: 3149.24,
diff: 3.99,
},
low: {
value: 3068.07,
diff: -28.34,
},
close: {
value: 3073.91,
diff: -44.66,
},
volume: 1563892000,
adjClose: 3073.91,
dayClose: [{
close: 3125.93,
date: new Date('2013/08/12'),
}, {
close: 3141.06,
date: new Date('2013/08/13'),
}, {
close: 3129.45,
date: new Date('2013/08/14'),
}, {
close: 3076.23,
date: new Date('2013/08/15'),
}, {
close: 3073.91,
date: new Date('2013/08/16'),
}],
}, {
date: new Date('2013/08/05'),
open: {
value: 3136.77,
diff: 69.29,
},
high: {
value: 3145.25,
diff: 1.73,
},
low: {
value: 3096.41,
diff: 33.5,
},
close: {
value: 3118.57,
diff: -24.95,
},
volume: 1565072000,
adjClose: 3118.57,
dayClose: [{
close: 3143.19,
date: new Date('2013/08/05'),
}, {
close: 3122.2,
date: new Date('2013/08/06'),
}, {
close: 3118.69,
date: new Date('2013/08/07'),
}, {
close: 3130.13,
date: new Date('2013/08/08'),
}, {
close: 3118.57,
date: new Date('2013/08/09'),
}],
}, {
date: new Date('2013/07/29'),
open: {
value: 3067.48,
diff: 5.98,
},
high: {
value: 3143.52,
diff: 67.29,
},
low: {
value: 3062.91,
diff: 33.84,
},
close: {
value: 3143.52,
diff: 67.29,
},
volume: 1759648000,
adjClose: 3143.52,
dayClose: [{
close: 3068.95,
date: new Date('2013/07/29'),
}, {
close: 3085.33,
date: new Date('2013/07/30'),
}, {
close: 3090.19,
date: new Date('2013/07/31'),
}, {
close: 3126.3,
date: new Date('2013/08/01'),
}, {
close: 3143.52,
date: new Date('2013/08/02'),
}],
}, {
date: new Date('2013/07/22'),
open: {
value: 3061.5,
diff: -15.52,
},
high: {
value: 3076.23,
diff: -14.98,
},
low: {
value: 3029.07,
diff: -6.92,
},
close: {
value: 3076.23,
diff: 31.3,
},
volume: 1796810000,
adjClose: 3076.23,
dayClose: [{
close: 3055.23,
date: new Date('2013/07/22'),
}, {
close: 3031.4,
date: new Date('2013/07/23'),
}, {
close: 3041.16,
date: new Date('2013/07/24'),
}, {
close: 3061.67,
date: new Date('2013/07/25'),
}, {
close: 3076.23,
date: new Date('2013/07/26'),
}],
}, {
date: new Date('2013/07/15'),
open: {
value: 3077.02,
diff: 100.41,
},
high: {
value: 3091.21,
diff: 12.14,
},
low: {
value: 3035.99,
diff: 80.62,
},
close: {
value: 3044.93,
diff: -34.14,
},
volume: 1621772000,
adjClose: 3044.93,
dayClose: [{
close: 3079.85,
date: new Date('2013/07/15'),
}, {
close: 3077.47,
date: new Date('2013/07/16'),
}, {
close: 3085.28,
date: new Date('2013/07/17'),
}, {
close: 3077.82,
date: new Date('2013/07/18'),
}, {
close: 3044.93,
date: new Date('2013/07/19'),
}],
}, {
date: new Date('2013/07/08'),
open: {
value: 2976.61,
diff: 43.13,
},
high: {
value: 3079.07,
diff: 115.25,
},
low: {
value: 2955.37,
diff: 41.89,
},
close: {
value: 3079.07,
diff: 115.85,
},
volume: 1616522000,
adjClose: 3079.07,
dayClose: [{
close: 2966.13,
date: new Date('2013/07/08'),
}, {
close: 2984.32,
date: new Date('2013/07/09'),
}, {
close: 3000.66,
date: new Date('2013/07/10'),
}, {
close: 3059.46,
date: new Date('2013/07/11'),
}, {
close: 3079.07,
date: new Date('2013/07/12'),
}],
}, {
date: new Date('2013/07/01'),
open: {
value: 2933.48,
diff: 80.83,
},
high: {
value: 2963.82,
diff: 36.33,
},
low: {
value: 2913.48,
diff: 88.3,
},
close: {
value: 2963.22,
diff: 53.62,
},
volume: 1365580000,
adjClose: 2963.22,
dayClose: [{
close: 2927.35,
date: new Date('2013/07/01'),
}, {
close: 2929.63,
date: new Date('2013/07/02'),
}, {
close: 2941.41,
date: new Date('2013/07/03'),
}, {
close: 2963.22,
date: new Date('2013/07/05'),
}],
}, {
date: new Date('2013/06/24'),
open: {
value: 2852.65,
diff: -114.68,
},
high: {
value: 2927.49,
diff: -74.4,
},
low: {
value: 2825.18,
diff: -28.51,
},
close: {
value: 2909.6,
diff: 31.66,
},
volume: 2135946000,
adjClose: 2909.6,
dayClose: [{
close: 2848.2,
date: new Date('2013/06/24'),
}, {
close: 2866.5,
date: new Date('2013/06/25'),
}, {
close: 2893.85,
date: new Date('2013/06/26'),
}, {
close: 2906.84,
date: new Date('2013/06/27'),
}, {
close: 2909.6,
date: new Date('2013/06/28'),
}],
}, {
date: new Date('2013/06/17'),
open: {
value: 2967.33,
diff: -27.7,
},
high: {
value: 3001.89,
diff: -2.78,
},
low: {
value: 2853.69,
diff: -60.51,
},
close: {
value: 2877.94,
diff: -65.92,
},
volume: 1973904000,
adjClose: 2877.94,
dayClose: [{
close: 2971.26,
date: new Date('2013/06/17'),
}, {
close: 2996.09,
date: new Date('2013/06/18'),
}, {
close: 2959.5,
date: new Date('2013/06/19'),
}, {
close: 2890.33,
date: new Date('2013/06/20'),
}, {
close: 2877.94,
date: new Date('2013/06/21'),
}],
}, {
date: new Date('2013/06/10'),
open: {
value: 2995.03,
diff: 10.44,
},
high: {
value: 3004.67,
diff: -2.63,
},
low: {
value: 2914.2,
diff: 2.26,
},
close: {
value: 2943.86,
diff: -47.01,
},
volume: 1557972000,
adjClose: 2943.86,
dayClose: [{
close: 2990.49,
date: new Date('2013/06/10'),
}, {
close: 2959.84,
date: new Date('2013/06/11'),
}, {
close: 2926.14,
date: new Date('2013/06/12'),
}, {
close: 2962.9,
date: new Date('2013/06/13'),
}, {
close: 2943.86,
date: new Date('2013/06/14'),
}],
}, {
date: new Date('2013/06/03'),
open: {
value: 2984.59,
diff: -39.79,
},
high: {
value: 3007.3,
diff: -29.7,
},
low: {
value: 2911.94,
diff: -67.96,
},
close: {
value: 2990.87,
diff: 9.11,
},
volume: 1837828000,
adjClose: 2990.87,
dayClose: [{
close: 2990.79,
date: new Date('2013/06/03'),
}, {
close: 2973.69,
date: new Date('2013/06/04'),
}, {
close: 2937.14,
date: new Date('2013/06/05'),
}, {
close: 2950.3,
date: new Date('2013/06/06'),
}, {
close: 2990.87,
date: new Date('2013/06/07'),
}],
}, {
date: new Date('2013/05/28'),
open: {
value: 3024.38,
diff: 5.1,
},
high: {
value: 3037,
diff: -16.51,
},
low: {
value: 2979.9,
diff: 14.6,
},
close: {
value: 2981.76,
diff: -9.26,
},
volume: 1812077500,
adjClose: 2981.76,
dayClose: [{
close: 3011.94,
date: new Date('2013/05/28'),
}, {
close: 2994.82,
date: new Date('2013/05/29'),
}, {
close: 3011.83,
date: new Date('2013/05/30'),
}, {
close: 2981.76,
date: new Date('2013/05/31'),
}],
}, {
date: new Date('2013/05/20'),
open: {
value: 3019.28,
diff: 46.32,
},
high: {
value: 3053.51,
diff: 24.55,
},
low: {
value: 2965.3,
diff: -6.43,
},
close: {
value: 2991.02,
diff: -37.94,
},
volume: 1794250000,
adjClose: 2991.02,
dayClose: [{
close: 3020.97,
date: new Date('2013/05/20'),
}, {
close: 3026.45,
date: new Date('2013/05/21'),
}, {
close: 2999.13,
date: new Date('2013/05/22'),
}, {
close: 2991.45,
date: new Date('2013/05/23'),
}, {
close: 2991.02,
date: new Date('2013/05/24'),
}],
}, {
date: new Date('2013/05/13'),
open: {
value: 2972.96,
diff: 24.06,
},
high: {
value: 3028.96,
diff: 47.94,
},
low: {
value: 2971.73,
diff: 29.48,
},
close: {
value: 3028.96,
diff: 47.94,
},
volume: 1810862000,
adjClose: 3028.96,
dayClose: [{
close: 2982.09,
date: new Date('2013/05/13'),
}, {
close: 2996.05,
date: new Date('2013/05/14'),
}, {
close: 3002.62,
date: new Date('2013/05/15'),
}, {
close: 2999.34,
date: new Date('2013/05/16'),
}, {
close: 3028.96,
date: new Date('2013/05/17'),
}],
}, {
date: new Date('2013/05/06'),
open: {
value: 2948.9,
diff: 99.36,
},
high: {
value: 2981.02,
diff: 28.8,
},
low: {
value: 2942.25,
diff: 93.21,
},
close: {
value: 2981.02,
diff: 36.43,
},
volume: 1696512000,
adjClose: 2981.02,
dayClose: [{
close: 2955.36,
date: new Date('2013/05/06'),
}, {
close: 2952.88,
date: new Date('2013/05/07'),
}, {
close: 2968.24,
date: new Date('2013/05/08'),
}, {
close: 2961.12,
date: new Date('2013/05/09'),
}, {
close: 2981.02,
date: new Date('2013/05/10'),
}],
}, {
date: new Date('2013/04/29'),
open: {
value: 2849.54,
diff: 57.77,
},
high: {
value: 2952.22,
diff: 91.53,
},
low: {
value: 2849.04,
diff: 68.22,
},
close: {
value: 2944.59,
diff: 104.04,
},
volume: 1793206000,
adjClose: 2944.59,
dayClose: [{
close: 2866.95,
date: new Date('2013/04/29'),
}, {
close: 2887.44,
date: new Date('2013/04/30'),
}, {
close: 2873.35,
date: new Date('2013/05/01'),
}, {
close: 2911.14,
date: new Date('2013/05/02'),
}, {
close: 2944.59,
date: new Date('2013/05/03'),
}],
}, {
date: new Date('2013/04/22'),
open: {
value: 2791.77,
diff: -49.49,
},
high: {
value: 2860.69,
diff: 11.53,
},
low: {
value: 2780.82,
diff: 49.85,
},
close: {
value: 2840.55,
diff: 60.09,
},
volume: 1757180000,
adjClose: 2840.55,
dayClose: [{
close: 2810.07,
date: new Date('2013/04/22'),
}, {
close: 2835.37,
date: new Date('2013/04/23'),
}, {
close: 2834.12,
date: new Date('2013/04/24'),
}, {
close: 2848.66,
date: new Date('2013/04/25'),
}, {
close: 2840.55,
date: new Date('2013/04/26'),
}],
}, {
date: new Date('2013/04/15'),
open: {
value: 2841.26,
diff: 68.96,
},
high: {
value: 2849.16,
diff: -14.5,
},
low: {
value: 2730.97,
diff: -33.37,
},
close: {
value: 2780.46,
diff: -76.02,
},
volume: 1740460000,
adjClose: 2780.46,
dayClose: [{
close: 2797.47,
date: new Date('2013/04/15'),
}, {
close: 2838.41,
date: new Date('2013/04/16'),
}, {
close: 2781.98,
date: new Date('2013/04/17'),
}, {
close: 2741.95,
date: new Date('2013/04/18'),
}, {
close: 2780.46,
date: new Date('2013/04/19'),
}],
}, {
date: new Date('2013/04/08'),
open: {
value: 2772.3,
diff: -47.48,
},
high: {
value: 2863.66,
diff: 35.02,
},
low: {
value: 2764.34,
diff: 20.08,
},
close: {
value: 2856.48,
diff: 84.73,
},
volume: 1578374000,
adjClose: 2856.48,
dayClose: [{
close: 2786.13,
date: new Date('2013/04/08'),
}, {
close: 2804.67,
date: new Date('2013/04/09'),
}, {
close: 2859.21,
date: new Date('2013/04/10'),
}, {
close: 2859.07,
date: new Date('2013/04/11'),
}, {
close: 2856.48,
date: new Date('2013/04/12'),
}],
}, {
date: new Date('2013/04/01'),
open: {
value: 2819.78,
diff: 9.03,
},
high: {
value: 2828.64,
diff: 7.97,
},
low: {
value: 2744.26,
diff: -34.52,
},
close: {
value: 2771.75,
diff: -46.94,
},
volume: 1589176000,
adjClose: 2771.75,
dayClose: [{
close: 2797.07,
date: new Date('2013/04/01'),
}, {
close: 2820.62,
date: new Date('2013/04/02'),
}, {
close: 2795.04,
date: new Date('2013/04/03'),
}, {
close: 2794.92,
date: new Date('2013/04/04'),
}, {
close: 2771.75,
date: new Date('2013/04/05'),
}],
}, {
date: new Date('2013/03/25'),
open: {
value: 2810.75,
diff: 39.22,
},
high: {
value: 2820.67,
diff: 9.19,
},
low: {
value: 2778.78,
diff: 15.66,
},
close: {
value: 2818.69,
diff: 17.88,
},
volume: 1541860000,
adjClose: 2818.69,
dayClose: [{
close: 2789.45,
date: new Date('2013/03/25'),
}, {
close: 2806.5,
date: new Date('2013/03/26'),
}, {
close: 2809.98,
date: new Date('2013/03/27'),
}, {
close: 2818.69,
date: new Date('2013/03/28'),
}],
}, {
date: new Date('2013/03/18'),
open: {
value: 2771.53,
diff: -26.6,
},
high: {
value: 2811.48,
diff: -0.81,
},
low: {
value: 2763.12,
diff: -24.6,
},
close: {
value: 2800.81,
diff: 1.4,
},
volume: 1642786000,
adjClose: 2800.81,
dayClose: [{
close: 2792.3,
date: new Date('2013/03/18'),
}, {
close: 2787.27,
date: new Date('2013/03/19'),
}, {
close: 2805.91,
date: new Date('2013/03/20'),
}, {
close: 2774.85,
date: new Date('2013/03/21'),
}, {
close: 2800.81,
date: new Date('2013/03/22'),
}],
}, {
date: new Date('2013/03/11'),
open: {
value: 2798.13,
diff: 59.92,
},
high: {
value: 2812.29,
diff: -0.44,
},
low: {
value: 2787.72,
diff: 52.8,
},
close: {
value: 2799.41,
diff: -4.7,
},
volume: 1767280000,
adjClose: 2799.41,
dayClose: [{
close: 2811.86,
date: new Date('2013/03/11'),
}, {
close: 2800.81,
date: new Date('2013/03/12'),
}, {
close: 2798.68,
date: new Date('2013/03/13'),
}, {
close: 2807.3,
date: new Date('2013/03/14'),
}, {
close: 2799.41,
date: new Date('2013/03/15'),
}],
}, {
date: new Date('2013/03/04'),
open: {
value: 2738.21,
diff: -17.98,
},
high: {
value: 2812.73,
diff: 48.77,
},
low: {
value: 2734.92,
diff: 45.09,
},
close: {
value: 2804.11,
diff: 56.36,
},
volume: 1732232000,
adjClose: 2804.11,
dayClose: [{
close: 2759.53,
date: new Date('2013/03/04'),
}, {
close: 2799.25,
date: new Date('2013/03/05'),
}, {
close: 2792.56,
date: new Date('2013/03/06'),
}, {
close: 2799.49,
date: new Date('2013/03/07'),
}, {
close: 2804.11,
date: new Date('2013/03/08'),
}],
}, {
date: new Date('2013/02/25'),
open: {
value: 2756.19,
diff: -14.51,
},
high: {
value: 2763.96,
diff: -18.9,
},
low: {
value: 2689.83,
diff: -10.49,
},
close: {
value: 2747.75,
diff: 10.47,
},
volume: 1879756000,
adjClose: 2747.75,
dayClose: [{
close: 2700.97,
date: new Date('2013/02/25'),
}, {
close: 2713.02,
date: new Date('2013/02/26'),
}, {
close: 2741.26,
date: new Date('2013/02/27'),
}, {
close: 2738.58,
date: new Date('2013/02/28'),
}, {
close: 2747.75,
date: new Date('2013/03/01'),
}],
}, {
date: new Date('2013/02/19'),
open: {
value: 2770.7,
diff: -3.74,
},
high: {
value: 2782.86,
diff: -0.33,
},
low: {
value: 2700.32,
diff: -56.11,
},
close: {
value: 2737.28,
diff: -27.39,
},
volume: 1869942500,
adjClose: 2737.28,
dayClose: [{
close: 2782.86,
date: new Date('2013/02/19'),
}, {
close: 2739.99,
date: new Date('2013/02/20'),
}, {
close: 2711.51,
date: new Date('2013/02/21'),
}, {
close: 2737.28,
date: new Date('2013/02/22'),
}],
}, {
date: new Date('2013/02/11'),
open: {
value: 2774.44,
diff: 25.04,
},
high: {
value: 2783.19,
diff: 3.06,
},
low: {
value: 2756.43,
diff: 40.92,
},
close: {
value: 2764.67,
diff: -10.89,
},
volume: 1788838000,
adjClose: 2764.67,
dayClose: [{
close: 2774.64,
date: new Date('2013/02/11'),
}, {
close: 2762.62,
date: new Date('2013/02/12'),
}, {
close: 2773.77,
date: new Date('2013/02/13'),
}, {
close: 2771.43,
date: new Date('2013/02/14'),
}, {
close: 2764.67,
date: new Date('2013/02/15'),
}],
}, {
date: new Date('2013/02/04'),
open: {
value: 2749.4,
diff: 11.78,
},
high: {
value: 2780.13,
diff: 11.5,
},
low: {
value: 2715.51,
diff: -7.01,
},
close: {
value: 2775.56,
diff: 11.6,
},
volume: 1960002000,
adjClose: 2775.56,
dayClose: [{
close: 2715.68,
date: new Date('2013/02/04'),
}, {
close: 2754.99,
date: new Date('2013/02/05'),
}, {
close: 2746.35,
date: new Date('2013/02/06'),
}, {
close: 2746.5,
date: new Date('2013/02/07'),
}, {
close: 2775.56,
date: new Date('2013/02/08'),
}],
}, {
date: new Date('2013/01/28'),
open: {
value: 2737.62,
diff: -6.65,
},
high: {
value: 2768.63,
diff: -0.68,
},
low: {
value: 2722.52,
diff: 2.69,
},
close: {
value: 2763.96,
diff: 27.23,
},
volume: 2040876000,
adjClose: 2763.96,
dayClose: [{
close: 2742.43,
date: new Date('2013/01/28'),
}, {
close: 2743.58,
date: new Date('2013/01/29'),
}, {
close: 2738.71,
date: new Date('2013/01/30'),
}, {
close: 2731.53,
date: new Date('2013/01/31'),
}, {
close: 2763.96,
date: new Date('2013/02/01'),
}],
}, {
date: new Date('2013/01/22'),
open: {
value: 2744.27,
diff: 10.81,
},
high: {
value: 2769.31,
diff: 12.63,
},
low: {
value: 2719.83,
diff: 9.03,
},
close: {
value: 2736.73,
diff: -6.51,
},
volume: 1864040000,
adjClose: 2736.73,
dayClose: [{
close: 2746.19,
date: new Date('2013/01/22'),
}, {
close: 2762.17,
date: new Date('2013/01/23'),
}, {
close: 2723.53,
date: new Date('2013/01/24'),
}, {
close: 2736.73,
date: new Date('2013/01/25'),
}],
}, {
date: new Date('2013/01/14'),
open: {
value: 2733.46,
diff: 20.02,
},
high: {
value: 2756.68,
diff: 7.32,
},
low: {
value: 2710.8,
diff: 7.05,
},
close: {
value: 2743.24,
diff: -5.02,
},
volume: 1809576000,
adjClose: 2743.24,
dayClose: [{
close: 2735.7,
date: new Date('2013/01/14'),
}, {
close: 2722.98,
date: new Date('2013/01/15'),
}, {
close: 2734.73,
date: new Date('2013/01/16'),
}, {
close: 2747.15,
date: new Date('2013/01/17'),
}, {
close: 2743.24,
date: new Date('2013/01/18'),
}],
}, {
date: new Date('2013/01/07'),
open: {
value: 2713.44,
diff: -14.23,
},
high: {
value: 2749.36,
diff: -1.46,
},
low: {
value: 2703.75,
diff: -12.29,
},
close: {
value: 2748.26,
diff: 23.77,
},
volume: 1741254000,
adjClose: 2748.26,
dayClose: [{
close: 2724.22,
date: new Date('2013/01/07'),
}, {
close: 2718.72,
date: new Date('2013/01/08'),
}, {
close: 2727.65,
date: new Date('2013/01/09'),
}, {
close: 2744.18,
date: new Date('2013/01/10'),
}, {
close: 2748.26,
date: new Date('2013/01/11'),
}],
}];
window.exports = window.exports || {};
window.config = {
transpiler: 'ts',
typescriptOptions: {
module: 'system',
emitDecoratorMetadata: true,
experimentalDecorators: true,
jsx: 'react',
},
meta: {
'react': {
'esModule': true,
},
'typescript': {
'exports': 'ts',
},
'devextreme/time_zone_utils.js': {
'esModule': true,
},
'devextreme/localization.js': {
'esModule': true,
},
'devextreme/viz/palette.js': {
'esModule': true,
},
},
paths: {
'npm:': 'https://unpkg.com/',
},
defaultExtension: 'js',
map: {
'ts': 'npm:plugin-typescript@4.2.4/lib/plugin.js',
'typescript': 'npm:typescript@4.2.4/lib/typescript.js',
'react': 'npm:react@17.0.2/umd/react.development.js',
'react-dom': 'npm:react-dom@17.0.2/umd/react-dom.development.js',
'prop-types': 'npm:prop-types@15.8.1/prop-types.js',
'globalize': 'npm:globalize@1.7.0/dist/globalize',
'json': 'npm:systemjs-plugin-json@0.3.0/json.js',
'cldr': 'npm:cldrjs@0.5.5/dist/cldr',
'rrule': 'npm:rrule@2.6.4/dist/es5/rrule.js',
'luxon': 'npm:luxon@1.28.1/build/global/luxon.min.js',
'es6-object-assign': 'npm:es6-object-assign@1.1.0',
'devextreme': 'npm:devextreme@24.1.7/cjs',
'devextreme-react': 'npm:devextreme-react@24.1.7/cjs',
'jszip': 'npm:jszip@3.10.1/dist/jszip.min.js',
'devextreme-quill': 'npm:devextreme-quill@1.7.1/dist/dx-quill.min.js',
'devexpress-diagram': 'npm:devexpress-diagram@2.2.12/dist/dx-diagram.js',
'devexpress-gantt': 'npm:devexpress-gantt@4.1.56/dist/dx-gantt.js',
'@devextreme/runtime': 'npm:@devextreme/runtime@3.0.13',
'inferno': 'npm:inferno@7.4.11/dist/inferno.min.js',
'inferno-compat': 'npm:inferno-compat/dist/inferno-compat.min.js',
'inferno-create-element': 'npm:inferno-create-element@7.4.11/dist/inferno-create-element.min.js',
'inferno-dom': 'npm:inferno-dom/dist/inferno-dom.min.js',
'inferno-hydrate': 'npm:inferno-hydrate@7.4.11/dist/inferno-hydrate.min.js',
'inferno-clone-vnode': 'npm:inferno-clone-vnode/dist/inferno-clone-vnode.min.js',
'inferno-create-class': 'npm:inferno-create-class/dist/inferno-create-class.min.js',
'inferno-extras': 'npm:inferno-extras/dist/inferno-extras.min.js',
'devextreme-cldr-data': 'npm:devextreme-cldr-data@1.0.3',
// SystemJS plugins
'plugin-babel': 'npm:systemjs-plugin-babel@0.0.25/plugin-babel.js',
'systemjs-babel-build': 'npm:systemjs-plugin-babel@0.0.25/systemjs-babel-browser.js',
// Prettier
'prettier/standalone': 'npm:prettier@2.8.8/standalone.js',
'prettier/parser-html': 'npm:prettier@2.8.8/parser-html.js',
},
packages: {
'devextreme': {
defaultExtension: 'js',
},
'devextreme-react': {
main: 'index.js',
},
'devextreme/events/utils': {
main: 'index',
},
'devextreme/localization/messages': {
format: 'json',
defaultExtension: 'json',
},
'devextreme/events': {
main: 'index',
},
'globalize': {
main: '../globalize.js',
defaultExtension: 'js',
},
'cldr': {
main: '../cldr.js',
defaultExtension: 'js',
},
'es6-object-assign': {
main: './index.js',
defaultExtension: 'js',
},
},
packageConfigPaths: [
'npm:@devextreme/*/package.json',
'npm:@devextreme/runtime@3.0.13/inferno/package.json',
],
babelOptions: {
sourceMaps: false,
stage0: true,
react: true,
},
};
System.config(window.config);
import React from 'react';
import Sparkline, { Size, Tooltip } from 'devextreme-react/sparkline';
const ChartCell = (cellData) => (
<div className="chart-cell">
<Sparkline
dataSource={cellData.data.dayClose}
argumentField="date"
valueField="close"
type="line"
showMinMax={true}
minColor="#f00"
maxColor="#2ab71b"
pointSize={6}
>
<Size
width={290}
height={40}
/>
<Tooltip enabled={false} />
</Sparkline>
</div>
);
export default ChartCell;
import React from 'react';
import 'devextreme/localization/globalize/currency';
import { formatNumber } from 'devextreme/localization';
const getGridCellData = (gridData) => gridData.data[gridData.column.caption.toLowerCase()];
const DiffCell = (cellData) => {
const gridCellData = getGridCellData(cellData);
return (
<div className={gridCellData.diff > 0 ? 'inc' : 'dec'}>
<div className="current-value">
{formatNumber(gridCellData.value, { type: 'currency', currency: 'USD', precision: 2 })}
</div>
<div className="diff">{Math.abs(gridCellData.diff).toFixed(2)}</div>
</div>
);
};
export default DiffCell;
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App.js';
ReactDOM.render(<App />, document.getElementById('app'));
export const weekData = [
{
date: new Date('2013/12/23'),
open: {
value: 3563.19,
diff: 92.76,
},
high: {
value: 3591.31,
diff: 50.34,
},
low: {
value: 3552.3,
diff: 129.44,
},
close: {
value: 3574.02,
diff: 42.83,
},
volume: 1254340000,
adjClose: 3574.02,
dayClose: [
{
close: 3569.4,
date: new Date('2013/12/23'),
},
{
close: 3572.8,
date: new Date('2013/12/24'),
},
{
close: 3584.58,
date: new Date('2013/12/26'),
},
{
close: 3574.02,
date: new Date('2013/12/27'),
},
],
},
{
date: new Date('2013/12/16'),
open: {
value: 3470.43,
diff: -45.24,
},
high: {
value: 3540.97,
diff: 16.96,
},
low: {
value: 3422.86,
diff: -26.88,
},
close: {
value: 3531.19,
diff: 74.79,
},
volume: 2261352000,
adjClose: 3531.19,
dayClose: [
{
close: 3475.79,
date: new Date('2013/12/16'),
},
{
close: 3469.32,
date: new Date('2013/12/17'),
},
{
close: 3509.63,
date: new Date('2013/12/18'),
},
{
close: 3498.63,
date: new Date('2013/12/19'),
},
{
close: 3531.19,
date: new Date('2013/12/20'),
},
],
},
{
date: new Date('2013/12/09'),
open: {
value: 3515.67,
diff: 19.48,
},
high: {
value: 3524.01,
diff: 12.91,
},
low: {
value: 3449.74,
diff: -3.48,
},
close: {
value: 3456.4,
diff: -47.86,
},
volume: 1802822000,
adjClose: 3456.4,
dayClose: [
{
close: 3516.17,
date: new Date('2013/12/09'),
},
{
close: 3514.2,
date: new Date('2013/12/10'),
},
{
close: 3468.99,
date: new Date('2013/12/11'),
},
{
close: 3460.29,
date: new Date('2013/12/12'),
},
{
close: 3456.4,
date: new Date('2013/12/13'),
},
],
},
{
date: new Date('2013/12/02'),
open: {
value: 3496.19,
diff: 62.27,
},
high: {
value: 3511.1,
diff: 15.13,
},
low: {
value: 3453.22,
diff: 32.86,
},
close: {
value: 3504.26,
diff: 16.44,
},
volume: 1810088000,
adjClose: 3504.26,
dayClose: [
{
close: 3481.15,
date: new Date('2013/12/02'),
},
{
close: 3479.34,
date: new Date('2013/12/03'),
},
{
close: 3483.01,
date: new Date('2013/12/04'),
},
{
close: 3477.73,
date: new Date('2013/12/05'),
},
{
close: 3504.26,
date: new Date('2013/12/06'),
},
],
},
{
date: new Date('2013/11/25'),
open: {
value: 3433.92,
diff: 10.45,
},
high: {
value: 3495.97,
diff: 66.77,
},
low: {
value: 3420.36,
diff: 61.05,
},
close: {
value: 3487.82,
diff: 65.8,
},
volume: 1508490000,
adjClose: 3487.82,
dayClose: [
{
close: 3427.49,
date: new Date('2013/11/25'),
},
{
close: 3445.76,
date: new Date('2013/11/26'),
},
{
close: 3470.48,
date: new Date('2013/11/27'),
},
{
close: 3487.82,
date: new Date('2013/11/29'),
},
],
},
{
date: new Date('2013/11/18'),
open: {
value: 3423.47,
diff: 63.64,
},
high: {
value: 3429.2,
diff: 6.62,
},
low: {
value: 3359.31,
diff: 12.9,
},
close: {
value: 3422.02,
diff: -0.56,
},
volume: 1742680000,
adjClose: 3422.02,
dayClose: [
{
close: 3388.87,
date: new Date('2013/11/18'),
},
{
close: 3378.13,
date: new Date('2013/11/19'),
},
{
close: 3367.17,
date: new Date('2013/11/20'),
},
{
close: 3402.74,
date: new Date('2013/11/21'),
},
{
close: 3422.02,
date: new Date('2013/11/22'),
},
],
},
{
date: new Date('2013/11/11'),
open: {
value: 3359.83,
diff: -28.87,
},
high: {
value: 3422.58,
diff: 21.31,
},
low: {
value: 3346.41,
diff: 28.01,
},
close: {
value: 3422.58,
diff: 55.74,
},
volume: 1812784000,
adjClose: 3422.58,
dayClose: [
{
close: 3362.98,
date: new Date('2013/11/11'),
},
{
close: 3365.23,
date: new Date('2013/11/12'),
},
{
close: 3405.56,
date: new Date('2013/11/13'),
},
{
close: 3415.14,
date: new Date('2013/11/14'),
},
{
close: 3422.58,
date: new Date('2013/11/15'),
},
],
},
{
date: new Date('2013/11/04'),
open: {
value: 3388.7,
diff: 6.52,
},
high: {
value: 3401.27,
diff: -7.01,
},
low: {
value: 3318.4,
diff: -46.25,
},
close: {
value: 3366.84,
diff: -12.92,
},
volume: 2011546000,
adjClose: 3366.84,
dayClose: [
{
close: 3384.75,
date: new Date('2013/11/04'),
},
{
close: 3388.82,
date: new Date('2013/11/05'),
},
{
close: 3385.38,
date: new Date('2013/11/06'),
},
{
close: 3321.41,
date: new Date('2013/11/07'),
},
{
close: 3366.84,
date: new Date('2013/11/08'),
},
],
},
{
date: new Date('2013/10/28'),
open: {
value: 3382.18,
diff: 20.42,
},
high: {
value: 3408.28,
diff: 8.24,
},
low: {
value: 3364.65,
diff: 34.45,
},
close: {
value: 3379.76,
diff: -4.07,
},
volume: 1962860000,
adjClose: 3379.76,
dayClose: [
{
close: 3382.68,
date: new Date('2013/10/28'),
},
{
close: 3391.75,
date: new Date('2013/10/29'),
},
{
close: 3385.38,
date: new Date('2013/10/30'),
},
{
close: 3377.73,
date: new Date('2013/10/31'),
},
{
close: 3379.76,
date: new Date('2013/11/01'),
},
],
},
{
date: new Date('2013/10/21'),
open: {
value: 3361.76,
diff: 148.38,
},
high: {
value: 3400.04,
diff: 44.41,
},
low: {
value: 3330.2,
diff: 118.15,
},
close: {
value: 3383.83,
diff: 29.95,
},
volume: 1952026000,
adjClose: 3383.83,
dayClose: [
{
close: 3361.18,
date: new Date('2013/10/21'),
},
{
close: 3366.93,
date: new Date('2013/10/22'),
},
{
close: 3346.05,
date: new Date('2013/10/23'),
},
{
close: 3362.38,
date: new Date('2013/10/24'),
},
{
close: 3383.83,
date: new Date('2013/10/25'),
},
],
},
{
date: new Date('2013/10/14'),
open: {
value: 3213.38,
diff: -2.39,
},
high: {
value: 3355.63,
diff: 115.52,
},
low: {
value: 3212.05,
diff: 94.36,
},
close: {
value: 3353.88,
diff: 120.05,
},
volume: 1772590000,
adjClose: 3353.88,
dayClose: [
{
close: 3256.02,
date: new Date('2013/10/14'),
},
{
close: 3244.66,
date: new Date('2013/10/15'),
},
{
close: 3281.67,
date: new Date('2013/10/16'),
},
{
close: 3301.28,
date: new Date('2013/10/17'),
},
{
close: 3353.88,
date: new Date('2013/10/18'),
},
],
},
{
date: new Date('2013/10/07'),
open: {
value: 3215.77,
diff: 25.37,
},
high: {
value: 3240.11,
diff: -16.6,
},
low: {
value: 3117.69,
diff: -69.17,
},
close: {
value: 3233.83,
diff: -8.74,
},
volume: 1891806000,
adjClose: 3233.83,
dayClose: [
{
close: 3215.69,
date: new Date('2013/10/07'),
},
{
close: 3153.87,
date: new Date('2013/10/08'),
},
{
close: 3142.54,
date: new Date('2013/10/09'),
},
{
close: 3210.84,
date: new Date('2013/10/10'),
},
{
close: 3233.83,
date: new Date('2013/10/11'),
},
],
},
{
date: new Date('2013/09/30'),
open: {
value: 3190.4,
diff: -51.92,
},
high: {
value: 3256.71,
diff: 13.28,
},
low: {
value: 3186.86,
diff: -15.89,
},
close: {
value: 3242.57,
diff: 12.27,
},
volume: 1793200000,
adjClose: 3242.57,
dayClose: [
{
close: 3218.2,
date: new Date('2013/09/30'),
},
{
close: 3253.05,
date: new Date('2013/10/01'),
},
{
close: 3253.26,
date: new Date('2013/10/02'),
},
{
close: 3213.83,
date: new Date('2013/10/03'),
},
{
close: 3242.57,
date: new Date('2013/10/04'),
},
],
},
{
date: new Date('2013/09/23'),
open: {
value: 3242.32,
diff: 39.13,
},
high: {
value: 3243.43,
diff: -5.09,
},
low: {
value: 3202.75,
diff: 39.62,
},
close: {
value: 3230.3,
diff: 5.57,
},
volume: 1775808000,
adjClose: 3230.3,
dayClose: [
{
close: 3219.34,
date: new Date('2013/09/23'),
},
{
close: 3218.66,
date: new Date('2013/09/24'),
},
{
close: 3208.55,
date: new Date('2013/09/25'),
},
{
close: 3234.04,
date: new Date('2013/09/26'),
},
{
close: 3230.3,
date: new Date('2013/09/27'),
},
],
},
{
date: new Date('2013/09/16'),
open: {
value: 3203.19,
diff: 57.17,
},
high: {
value: 3248.52,
diff: 59.28,
},
low: {
value: 3163.13,
diff: 17.11,
},
close: {
value: 3224.73,
diff: 46.45,
},
volume: 1839474000,
adjClose: 3224.73,
dayClose: [
{
close: 3168.69,
date: new Date('2013/09/16'),
},
{
close: 3190.83,
date: new Date('2013/09/17'),
},
{
close: 3231.31,
date: new Date('2013/09/18'),
},
{
close: 3237.61,
date: new Date('2013/09/19'),
},
{
close: 3224.73,
date: new Date('2013/09/20'),
},
],
},
{
date: new Date('2013/09/09'),
open: {
value: 3146.02,
diff: 48.37,
},
high: {
value: 3189.24,
diff: 40.25,
},
low: {
value: 3146.02,
diff: 68.89,
},
close: {
value: 3178.28,
diff: 44.9,
},
volume: 1668658000,
adjClose: 3178.28,
dayClose: [
{
close: 3169.93,
date: new Date('2013/09/09'),
},
{
close: 3185.07,
date: new Date('2013/09/10'),
},
{
close: 3179.86,
date: new Date('2013/09/11'),
},
{
close: 3175.57,
date: new Date('2013/09/12'),
},
{
close: 3178.28,
date: new Date('2013/09/13'),
},
],
},
{
date: new Date('2013/09/03'),
open: {
value: 3097.65,
diff: -29.36,
},
high: {
value: 3148.99,
diff: 1.12,
},
low: {
value: 3077.13,
diff: 23.87,
},
close: {
value: 3133.38,
diff: 59.57,
},
volume: 1670570000,
adjClose: 3133.38,
dayClose: [
{
close: 3091.76,
date: new Date('2013/09/03'),
},
{
close: 3124.54,
date: new Date('2013/09/04'),
},
{
close: 3129.94,
date: new Date('2013/09/05'),
},
{
close: 3133.38,
date: new Date('2013/09/06'),
},
],
},
{
date: new Date('2013/08/26'),
open: {
value: 3127.01,
diff: 52.63,
},
high: {
value: 3147.87,
diff: 20.82,
},
low: {
value: 3053.26,
diff: -8.16,
},
close: {
value: 3073.81,
diff: -50.46,
},
volume: 1417628000,
adjClose: 3073.81,
dayClose: [
{
close: 3122.67,
date: new Date('2013/08/26'),
},
{
close: 3059.58,
date: new Date('2013/08/27'),
},
{
close: 3072.17,
date: new Date('2013/08/28'),
},
{
close: 3093.36,
date: new Date('2013/08/29'),
},
{
close: 3073.81,
date: new Date('2013/08/30'),
},
],
},
{
date: new Date('2013/08/19'),
open: {
value: 3074.38,
diff: -32.68,
},
high: {
value: 3127.05,
diff: -22.19,
},
low: {
value: 3061.42,
diff: -6.65,
},
close: {
value: 3124.27,
diff: 50.36,
},
volume: 1305026000,
adjClose: 3124.27,
dayClose: [
{
close: 3069.76,
date: new Date('2013/08/19'),
},
{
close: 3082.17,
date: new Date('2013/08/20'),
},
{
close: 3071.47,
date: new Date('2013/08/21'),
},
{
close: 3101.82,
date: new Date('2013/08/22'),
},
{
close: 3124.27,
date: new Date('2013/08/23'),
},
],
},
{
date: new Date('2013/08/12'),
open: {
value: 3107.06,
diff: -29.71,
},
high: {
value: 3149.24,
diff: 3.99,
},
low: {
value: 3068.07,
diff: -28.34,
},
close: {
value: 3073.91,
diff: -44.66,
},
volume: 1563892000,
adjClose: 3073.91,
dayClose: [
{
close: 3125.93,
date: new Date('2013/08/12'),
},
{
close: 3141.06,
date: new Date('2013/08/13'),
},
{
close: 3129.45,
date: new Date('2013/08/14'),
},
{
close: 3076.23,
date: new Date('2013/08/15'),
},
{
close: 3073.91,
date: new Date('2013/08/16'),
},
],
},
{
date: new Date('2013/08/05'),
open: {
value: 3136.77,
diff: 69.29,
},
high: {
value: 3145.25,
diff: 1.73,
},
low: {
value: 3096.41,
diff: 33.5,
},
close: {
value: 3118.57,
diff: -24.95,
},
volume: 1565072000,
adjClose: 3118.57,
dayClose: [
{
close: 3143.19,
date: new Date('2013/08/05'),
},
{
close: 3122.2,
date: new Date('2013/08/06'),
},
{
close: 3118.69,
date: new Date('2013/08/07'),
},
{
close: 3130.13,
date: new Date('2013/08/08'),
},
{
close: 3118.57,
date: new Date('2013/08/09'),
},
],
},
{
date: new Date('2013/07/29'),
open: {
value: 3067.48,
diff: 5.98,
},
high: {
value: 3143.52,
diff: 67.29,
},
low: {
value: 3062.91,
diff: 33.84,
},
close: {
value: 3143.52,
diff: 67.29,
},
volume: 1759648000,
adjClose: 3143.52,
dayClose: [
{
close: 3068.95,
date: new Date('2013/07/29'),
},
{
close: 3085.33,
date: new Date('2013/07/30'),
},
{
close: 3090.19,
date: new Date('2013/07/31'),
},
{
close: 3126.3,
date: new Date('2013/08/01'),
},
{
close: 3143.52,
date: new Date('2013/08/02'),
},
],
},
{
date: new Date('2013/07/22'),
open: {
value: 3061.5,
diff: -15.52,
},
high: {
value: 3076.23,
diff: -14.98,
},
low: {
value: 3029.07,
diff: -6.92,
},
close: {
value: 3076.23,
diff: 31.3,
},
volume: 1796810000,
adjClose: 3076.23,
dayClose: [
{
close: 3055.23,
date: new Date('2013/07/22'),
},
{
close: 3031.4,
date: new Date('2013/07/23'),
},
{
close: 3041.16,
date: new Date('2013/07/24'),
},
{
close: 3061.67,
date: new Date('2013/07/25'),
},
{
close: 3076.23,
date: new Date('2013/07/26'),
},
],
},
{
date: new Date('2013/07/15'),
open: {
value: 3077.02,
diff: 100.41,
},
high: {
value: 3091.21,
diff: 12.14,
},
low: {
value: 3035.99,
diff: 80.62,
},
close: {
value: 3044.93,
diff: -34.14,
},
volume: 1621772000,
adjClose: 3044.93,
dayClose: [
{
close: 3079.85,
date: new Date('2013/07/15'),
},
{
close: 3077.47,
date: new Date('2013/07/16'),
},
{
close: 3085.28,
date: new Date('2013/07/17'),
},
{
close: 3077.82,
date: new Date('2013/07/18'),
},
{
close: 3044.93,
date: new Date('2013/07/19'),
},
],
},
{
date: new Date('2013/07/08'),
open: {
value: 2976.61,
diff: 43.13,
},
high: {
value: 3079.07,
diff: 115.25,
},
low: {
value: 2955.37,
diff: 41.89,
},
close: {
value: 3079.07,
diff: 115.85,
},
volume: 1616522000,
adjClose: 3079.07,
dayClose: [
{
close: 2966.13,
date: new Date('2013/07/08'),
},
{
close: 2984.32,
date: new Date('2013/07/09'),
},
{
close: 3000.66,
date: new Date('2013/07/10'),
},
{
close: 3059.46,
date: new Date('2013/07/11'),
},
{
close: 3079.07,
date: new Date('2013/07/12'),
},
],
},
{
date: new Date('2013/07/01'),
open: {
value: 2933.48,
diff: 80.83,
},
high: {
value: 2963.82,
diff: 36.33,
},
low: {
value: 2913.48,
diff: 88.3,
},
close: {
value: 2963.22,
diff: 53.62,
},
volume: 1365580000,
adjClose: 2963.22,
dayClose: [
{
close: 2927.35,
date: new Date('2013/07/01'),
},
{
close: 2929.63,
date: new Date('2013/07/02'),
},
{
close: 2941.41,
date: new Date('2013/07/03'),
},
{
close: 2963.22,
date: new Date('2013/07/05'),
},
],
},
{
date: new Date('2013/06/24'),
open: {
value: 2852.65,
diff: -114.68,
},
high: {
value: 2927.49,
diff: -74.4,
},
low: {
value: 2825.18,
diff: -28.51,
},
close: {
value: 2909.6,
diff: 31.66,
},
volume: 2135946000,
adjClose: 2909.6,
dayClose: [
{
close: 2848.2,
date: new Date('2013/06/24'),
},
{
close: 2866.5,
date: new Date('2013/06/25'),
},
{
close: 2893.85,
date: new Date('2013/06/26'),
},
{
close: 2906.84,
date: new Date('2013/06/27'),
},
{
close: 2909.6,
date: new Date('2013/06/28'),
},
],
},
{
date: new Date('2013/06/17'),
open: {
value: 2967.33,
diff: -27.7,
},
high: {
value: 3001.89,
diff: -2.78,
},
low: {
value: 2853.69,
diff: -60.51,
},
close: {
value: 2877.94,
diff: -65.92,
},
volume: 1973904000,
adjClose: 2877.94,
dayClose: [
{
close: 2971.26,
date: new Date('2013/06/17'),
},
{
close: 2996.09,
date: new Date('2013/06/18'),
},
{
close: 2959.5,
date: new Date('2013/06/19'),
},
{
close: 2890.33,
date: new Date('2013/06/20'),
},
{
close: 2877.94,
date: new Date('2013/06/21'),
},
],
},
{
date: new Date('2013/06/10'),
open: {
value: 2995.03,
diff: 10.44,
},
high: {
value: 3004.67,
diff: -2.63,
},
low: {
value: 2914.2,
diff: 2.26,
},
close: {
value: 2943.86,
diff: -47.01,
},
volume: 1557972000,
adjClose: 2943.86,
dayClose: [
{
close: 2990.49,
date: new Date('2013/06/10'),
},
{
close: 2959.84,
date: new Date('2013/06/11'),
},
{
close: 2926.14,
date: new Date('2013/06/12'),
},
{
close: 2962.9,
date: new Date('2013/06/13'),
},
{
close: 2943.86,
date: new Date('2013/06/14'),
},
],
},
{
date: new Date('2013/06/03'),
open: {
value: 2984.59,
diff: -39.79,
},
high: {
value: 3007.3,
diff: -29.7,
},
low: {
value: 2911.94,
diff: -67.96,
},
close: {
value: 2990.87,
diff: 9.11,
},
volume: 1837828000,
adjClose: 2990.87,
dayClose: [
{
close: 2990.79,
date: new Date('2013/06/03'),
},
{
close: 2973.69,
date: new Date('2013/06/04'),
},
{
close: 2937.14,
date: new Date('2013/06/05'),
},
{
close: 2950.3,
date: new Date('2013/06/06'),
},
{
close: 2990.87,
date: new Date('2013/06/07'),
},
],
},
{
date: new Date('2013/05/28'),
open: {
value: 3024.38,
diff: 5.1,
},
high: {
value: 3037,
diff: -16.51,
},
low: {
value: 2979.9,
diff: 14.6,
},
close: {
value: 2981.76,
diff: -9.26,
},
volume: 1812077500,
adjClose: 2981.76,
dayClose: [
{
close: 3011.94,
date: new Date('2013/05/28'),
},
{
close: 2994.82,
date: new Date('2013/05/29'),
},
{
close: 3011.83,
date: new Date('2013/05/30'),
},
{
close: 2981.76,
date: new Date('2013/05/31'),
},
],
},
{
date: new Date('2013/05/20'),
open: {
value: 3019.28,
diff: 46.32,
},
high: {
value: 3053.51,
diff: 24.55,
},
low: {
value: 2965.3,
diff: -6.43,
},
close: {
value: 2991.02,
diff: -37.94,
},
volume: 1794250000,
adjClose: 2991.02,
dayClose: [
{
close: 3020.97,
date: new Date('2013/05/20'),
},
{
close: 3026.45,
date: new Date('2013/05/21'),
},
{
close: 2999.13,
date: new Date('2013/05/22'),
},
{
close: 2991.45,
date: new Date('2013/05/23'),
},
{
close: 2991.02,
date: new Date('2013/05/24'),
},
],
},
{
date: new Date('2013/05/13'),
open: {
value: 2972.96,
diff: 24.06,
},
high: {
value: 3028.96,
diff: 47.94,
},
low: {
value: 2971.73,
diff: 29.48,
},
close: {
value: 3028.96,
diff: 47.94,
},
volume: 1810862000,
adjClose: 3028.96,
dayClose: [
{
close: 2982.09,
date: new Date('2013/05/13'),
},
{
close: 2996.05,
date: new Date('2013/05/14'),
},
{
close: 3002.62,
date: new Date('2013/05/15'),
},
{
close: 2999.34,
date: new Date('2013/05/16'),
},
{
close: 3028.96,
date: new Date('2013/05/17'),
},
],
},
{
date: new Date('2013/05/06'),
open: {
value: 2948.9,
diff: 99.36,
},
high: {
value: 2981.02,
diff: 28.8,
},
low: {
value: 2942.25,
diff: 93.21,
},
close: {
value: 2981.02,
diff: 36.43,
},
volume: 1696512000,
adjClose: 2981.02,
dayClose: [
{
close: 2955.36,
date: new Date('2013/05/06'),
},
{
close: 2952.88,
date: new Date('2013/05/07'),
},
{
close: 2968.24,
date: new Date('2013/05/08'),
},
{
close: 2961.12,
date: new Date('2013/05/09'),
},
{
close: 2981.02,
date: new Date('2013/05/10'),
},
],
},
{
date: new Date('2013/04/29'),
open: {
value: 2849.54,
diff: 57.77,
},
high: {
value: 2952.22,
diff: 91.53,
},
low: {
value: 2849.04,
diff: 68.22,
},
close: {
value: 2944.59,
diff: 104.04,
},
volume: 1793206000,
adjClose: 2944.59,
dayClose: [
{
close: 2866.95,
date: new Date('2013/04/29'),
},
{
close: 2887.44,
date: new Date('2013/04/30'),
},
{
close: 2873.35,
date: new Date('2013/05/01'),
},
{
close: 2911.14,
date: new Date('2013/05/02'),
},
{
close: 2944.59,
date: new Date('2013/05/03'),
},
],
},
{
date: new Date('2013/04/22'),
open: {
value: 2791.77,
diff: -49.49,
},
high: {
value: 2860.69,
diff: 11.53,
},
low: {
value: 2780.82,
diff: 49.85,
},
close: {
value: 2840.55,
diff: 60.09,
},
volume: 1757180000,
adjClose: 2840.55,
dayClose: [
{
close: 2810.07,
date: new Date('2013/04/22'),
},
{
close: 2835.37,
date: new Date('2013/04/23'),
},
{
close: 2834.12,
date: new Date('2013/04/24'),
},
{
close: 2848.66,
date: new Date('2013/04/25'),
},
{
close: 2840.55,
date: new Date('2013/04/26'),
},
],
},
{
date: new Date('2013/04/15'),
open: {
value: 2841.26,
diff: 68.96,
},
high: {
value: 2849.16,
diff: -14.5,
},
low: {
value: 2730.97,
diff: -33.37,
},
close: {
value: 2780.46,
diff: -76.02,
},
volume: 1740460000,
adjClose: 2780.46,
dayClose: [
{
close: 2797.47,
date: new Date('2013/04/15'),
},
{
close: 2838.41,
date: new Date('2013/04/16'),
},
{
close: 2781.98,
date: new Date('2013/04/17'),
},
{
close: 2741.95,
date: new Date('2013/04/18'),
},
{
close: 2780.46,
date: new Date('2013/04/19'),
},
],
},
{
date: new Date('2013/04/08'),
open: {
value: 2772.3,
diff: -47.48,
},
high: {
value: 2863.66,
diff: 35.02,
},
low: {
value: 2764.34,
diff: 20.08,
},
close: {
value: 2856.48,
diff: 84.73,
},
volume: 1578374000,
adjClose: 2856.48,
dayClose: [
{
close: 2786.13,
date: new Date('2013/04/08'),
},
{
close: 2804.67,
date: new Date('2013/04/09'),
},
{
close: 2859.21,
date: new Date('2013/04/10'),
},
{
close: 2859.07,
date: new Date('2013/04/11'),
},
{
close: 2856.48,
date: new Date('2013/04/12'),
},
],
},
{
date: new Date('2013/04/01'),
open: {
value: 2819.78,
diff: 9.03,
},
high: {
value: 2828.64,
diff: 7.97,
},
low: {
value: 2744.26,
diff: -34.52,
},
close: {
value: 2771.75,
diff: -46.94,
},
volume: 1589176000,
adjClose: 2771.75,
dayClose: [
{
close: 2797.07,
date: new Date('2013/04/01'),
},
{
close: 2820.62,
date: new Date('2013/04/02'),
},
{
close: 2795.04,
date: new Date('2013/04/03'),
},
{
close: 2794.92,
date: new Date('2013/04/04'),
},
{
close: 2771.75,
date: new Date('2013/04/05'),
},
],
},
{
date: new Date('2013/03/25'),
open: {
value: 2810.75,
diff: 39.22,
},
high: {
value: 2820.67,
diff: 9.19,
},
low: {
value: 2778.78,
diff: 15.66,
},
close: {
value: 2818.69,
diff: 17.88,
},
volume: 1541860000,
adjClose: 2818.69,
dayClose: [
{
close: 2789.45,
date: new Date('2013/03/25'),
},
{
close: 2806.5,
date: new Date('2013/03/26'),
},
{
close: 2809.98,
date: new Date('2013/03/27'),
},
{
close: 2818.69,
date: new Date('2013/03/28'),
},
],
},
{
date: new Date('2013/03/18'),
open: {
value: 2771.53,
diff: -26.6,
},
high: {
value: 2811.48,
diff: -0.81,
},
low: {
value: 2763.12,
diff: -24.6,
},
close: {
value: 2800.81,
diff: 1.4,
},
volume: 1642786000,
adjClose: 2800.81,
dayClose: [
{
close: 2792.3,
date: new Date('2013/03/18'),
},
{
close: 2787.27,
date: new Date('2013/03/19'),
},
{
close: 2805.91,
date: new Date('2013/03/20'),
},
{
close: 2774.85,
date: new Date('2013/03/21'),
},
{
close: 2800.81,
date: new Date('2013/03/22'),
},
],
},
{
date: new Date('2013/03/11'),
open: {
value: 2798.13,
diff: 59.92,
},
high: {
value: 2812.29,
diff: -0.44,
},
low: {
value: 2787.72,
diff: 52.8,
},
close: {
value: 2799.41,
diff: -4.7,
},
volume: 1767280000,
adjClose: 2799.41,
dayClose: [
{
close: 2811.86,
date: new Date('2013/03/11'),
},
{
close: 2800.81,
date: new Date('2013/03/12'),
},
{
close: 2798.68,
date: new Date('2013/03/13'),
},
{
close: 2807.3,
date: new Date('2013/03/14'),
},
{
close: 2799.41,
date: new Date('2013/03/15'),
},
],
},
{
date: new Date('2013/03/04'),
open: {
value: 2738.21,
diff: -17.98,
},
high: {
value: 2812.73,
diff: 48.77,
},
low: {
value: 2734.92,
diff: 45.09,
},
close: {
value: 2804.11,
diff: 56.36,
},
volume: 1732232000,
adjClose: 2804.11,
dayClose: [
{
close: 2759.53,
date: new Date('2013/03/04'),
},
{
close: 2799.25,
date: new Date('2013/03/05'),
},
{
close: 2792.56,
date: new Date('2013/03/06'),
},
{
close: 2799.49,
date: new Date('2013/03/07'),
},
{
close: 2804.11,
date: new Date('2013/03/08'),
},
],
},
{
date: new Date('2013/02/25'),
open: {
value: 2756.19,
diff: -14.51,
},
high: {
value: 2763.96,
diff: -18.9,
},
low: {
value: 2689.83,
diff: -10.49,
},
close: {
value: 2747.75,
diff: 10.47,
},
volume: 1879756000,
adjClose: 2747.75,
dayClose: [
{
close: 2700.97,
date: new Date('2013/02/25'),
},
{
close: 2713.02,
date: new Date('2013/02/26'),
},
{
close: 2741.26,
date: new Date('2013/02/27'),
},
{
close: 2738.58,
date: new Date('2013/02/28'),
},
{
close: 2747.75,
date: new Date('2013/03/01'),
},
],
},
{
date: new Date('2013/02/19'),
open: {
value: 2770.7,
diff: -3.74,
},
high: {
value: 2782.86,
diff: -0.33,
},
low: {
value: 2700.32,
diff: -56.11,
},
close: {
value: 2737.28,
diff: -27.39,
},
volume: 1869942500,
adjClose: 2737.28,
dayClose: [
{
close: 2782.86,
date: new Date('2013/02/19'),
},
{
close: 2739.99,
date: new Date('2013/02/20'),
},
{
close: 2711.51,
date: new Date('2013/02/21'),
},
{
close: 2737.28,
date: new Date('2013/02/22'),
},
],
},
{
date: new Date('2013/02/11'),
open: {
value: 2774.44,
diff: 25.04,
},
high: {
value: 2783.19,
diff: 3.06,
},
low: {
value: 2756.43,
diff: 40.92,
},
close: {
value: 2764.67,
diff: -10.89,
},
volume: 1788838000,
adjClose: 2764.67,
dayClose: [
{
close: 2774.64,
date: new Date('2013/02/11'),
},
{
close: 2762.62,
date: new Date('2013/02/12'),
},
{
close: 2773.77,
date: new Date('2013/02/13'),
},
{
close: 2771.43,
date: new Date('2013/02/14'),
},
{
close: 2764.67,
date: new Date('2013/02/15'),
},
],
},
{
date: new Date('2013/02/04'),
open: {
value: 2749.4,
diff: 11.78,
},
high: {
value: 2780.13,
diff: 11.5,
},
low: {
value: 2715.51,
diff: -7.01,
},
close: {
value: 2775.56,
diff: 11.6,
},
volume: 1960002000,
adjClose: 2775.56,
dayClose: [
{
close: 2715.68,
date: new Date('2013/02/04'),
},
{
close: 2754.99,
date: new Date('2013/02/05'),
},
{
close: 2746.35,
date: new Date('2013/02/06'),
},
{
close: 2746.5,
date: new Date('2013/02/07'),
},
{
close: 2775.56,
date: new Date('2013/02/08'),
},
],
},
{
date: new Date('2013/01/28'),
open: {
value: 2737.62,
diff: -6.65,
},
high: {
value: 2768.63,
diff: -0.68,
},
low: {
value: 2722.52,
diff: 2.69,
},
close: {
value: 2763.96,
diff: 27.23,
},
volume: 2040876000,
adjClose: 2763.96,
dayClose: [
{
close: 2742.43,
date: new Date('2013/01/28'),
},
{
close: 2743.58,
date: new Date('2013/01/29'),
},
{
close: 2738.71,
date: new Date('2013/01/30'),
},
{
close: 2731.53,
date: new Date('2013/01/31'),
},
{
close: 2763.96,
date: new Date('2013/02/01'),
},
],
},
{
date: new Date('2013/01/22'),
open: {
value: 2744.27,
diff: 10.81,
},
high: {
value: 2769.31,
diff: 12.63,
},
low: {
value: 2719.83,
diff: 9.03,
},
close: {
value: 2736.73,
diff: -6.51,
},
volume: 1864040000,
adjClose: 2736.73,
dayClose: [
{
close: 2746.19,
date: new Date('2013/01/22'),
},
{
close: 2762.17,
date: new Date('2013/01/23'),
},
{
close: 2723.53,
date: new Date('2013/01/24'),
},
{
close: 2736.73,
date: new Date('2013/01/25'),
},
],
},
{
date: new Date('2013/01/14'),
open: {
value: 2733.46,
diff: 20.02,
},
high: {
value: 2756.68,
diff: 7.32,
},
low: {
value: 2710.8,
diff: 7.05,
},
close: {
value: 2743.24,
diff: -5.02,
},
volume: 1809576000,
adjClose: 2743.24,
dayClose: [
{
close: 2735.7,
date: new Date('2013/01/14'),
},
{
close: 2722.98,
date: new Date('2013/01/15'),
},
{
close: 2734.73,
date: new Date('2013/01/16'),
},
{
close: 2747.15,
date: new Date('2013/01/17'),
},
{
close: 2743.24,
date: new Date('2013/01/18'),
},
],
},
{
date: new Date('2013/01/07'),
open: {
value: 2713.44,
diff: -14.23,
},
high: {
value: 2749.36,
diff: -1.46,
},
low: {
value: 2703.75,
diff: -12.29,
},
close: {
value: 2748.26,
diff: 23.77,
},
volume: 1741254000,
adjClose: 2748.26,
dayClose: [
{
close: 2724.22,
date: new Date('2013/01/07'),
},
{
close: 2718.72,
date: new Date('2013/01/08'),
},
{
close: 2727.65,
date: new Date('2013/01/09'),
},
{
close: 2744.18,
date: new Date('2013/01/10'),
},
{
close: 2748.26,
date: new Date('2013/01/11'),
},
],
},
];
<!DOCTYPE html>
<html lang="en">
<head>
<title>DevExtreme Demo</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
<link rel="stylesheet" type="text/css" href="https://cdn3.devexpress.com/jslib/24.1.7/css/dx.light.css" />
<link rel="stylesheet" type="text/css" href="styles.css" />
<script src="https://unpkg.com/core-js@2.6.12/client/shim.min.js"></script>
<script src="https://unpkg.com/systemjs@0.21.3/dist/system.js"></script>
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript">
System.import("./index.tsx");
</script>
</head>
<body class="dx-viewport">
<div class="demo-container">
<div id="app"></div>
</div>
</body>
</html>
#gridContainer td {
vertical-align: middle;
}
#gridContainer .chart-cell {
overflow: visible;
}
#gridContainer .current-value {
display: inline-block;
}
#gridContainer .diff {
position: relative;
display: table-cell;
font-size: 16px;
}
#gridContainer .inc .diff {
color: #2ab71b;
}
#gridContainer .inc .diff::before {
content: '+';
}
#gridContainer .dec .diff::before {
content: '-';
}
#gridContainer .dec .diff {
color: #f00;
}
#gridContainer .inc .diff::after,
#gridContainer .dec .diff::after {
content: '';
display: block;
height: 10px;
width: 10px;
position: absolute;
right: -12px;
top: 6px;
background-repeat: no-repeat;
background-size: 10px 10px;
}
#gridContainer .inc .diff::after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADKSURBVHjaYtTaLs1ABEiG0nPRJa56PEHhsxBhmCUQT4OyrwHxcXyKmQgYJgHE64CYDYrXQcXIMhCbAcgWkGzgNKh38QUB0QamIUUErkhKI9ZAGyCeTERkTYaqxWsgKA2txhdG6GGsvUNGGpeBRMUiGhCFGsqGzUBQQJsxkA5AemaiG5hDIBIIgQSgK0FmMDACs549kN5FZLjhA7+A2A2U9YSAOBeLAk4gnoBDczoOcSFGPIUDPxB/wCHHiKtwYGKgMhg1cBAaCBBgAJTUIL3ToPZfAAAAAElFTkSuQmCC');
}
#gridContainer .dec .diff::after {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAADJSURBVHjaYvzPgBfgkhYA4o8QFahKmBioDEYNHIQGsgBxIBCLkqgvAYi/g1mMjMjir0EJzR6If/6HpChKMMgMe3DKBeIcKhiY8x/MYoDj+RQYNgdkGLqBbEB8kgzDToL1YjEQhKWB+BUJhj0H64Eahs1AELYhMpJ+gtUiGYbLQBBOI8LANLBaIg1kAAc0vkiAqSPBQFAkHcNi2DGoHMkGgrAENOCRI0ECRQ2JBoKwJTQCfkLZDPgMZPxPXN5NhtJzMSsJVBMAAgwAyWSY2svfmrwAAAAASUVORK5CYII=');
}