]> git.proxmox.com Git - extjs.git/blame - extjs/examples/kitchensink/classic/samples/view/charts/bar3d/Negative.js
add extjs 6.0.1 sources
[extjs.git] / extjs / examples / kitchensink / classic / samples / view / charts / bar3d / Negative.js
CommitLineData
6527f429
DM
1/**\r
2 * A 3D column chart with negative values.\r
3 * Tapping or hovering a column will highlight it.\r
4 */\r
5Ext.define('KitchenSink.view.charts.bar3d.Negative', {\r
6 extend: 'Ext.Panel',\r
7 xtype: 'bar-negative-3d',\r
8 requires: ['Ext.chart.theme.Muted'],\r
9 controller: 'bar-negative-3d',\r
10 // <example>\r
11 // Content between example tags is omitted from code preview.\r
12 otherContent: [{\r
13 type: 'Controller',\r
14 path: 'classic/samples/view/charts/bar3d/NegativeController.js'\r
15 }, {\r
16 type: 'Store',\r
17 path: 'classic/samples/store/Earnings.js'\r
18 }],\r
19 bodyStyle: 'background: transparent !important',\r
20 layout: 'fit',\r
21 // </example>\r
22\r
23 width: 650,\r
24 height: 600,\r
25\r
26 tbar: [\r
27 '->',\r
28 {\r
29 text: Ext.os.is.Desktop ? 'Download' : 'Preview',\r
30 handler: 'onDownload'\r
31 }\r
32 ],\r
33\r
34 items: {\r
35 xtype: 'cartesian',\r
36 flipXY: true,\r
37 reference: 'chart',\r
38 theme: 'muted',\r
39 store: {\r
40 type: 'earnings'\r
41 },\r
42 insetPadding: '40 40 40 20',\r
43 innerPadding: '8 0 0 0',\r
44 interactions: ['itemhighlight'],\r
45 animation: false,\r
46 axes: [{\r
47 type: 'numeric3d',\r
48 position: 'bottom',\r
49 fields: 'gaming',\r
50 grid: {\r
51 odd: {\r
52 fillStyle: 'rgba(255, 255, 255, 0.06)'\r
53 },\r
54 even: {\r
55 fillStyle: 'rgba(0, 0, 0, 0.05)'\r
56 }\r
57 }\r
58 }, {\r
59 type: 'category3d',\r
60 position: 'left',\r
61 fields: 'quarter',\r
62 grid: true\r
63 }],\r
64 series: [{\r
65 type: 'bar3d',\r
66 xField: 'quarter',\r
67 yField: 'gaming',\r
68 highlightCfg: {\r
69 saturationFactor: 0\r
70 },\r
71 label: {\r
72 fillStyle: 'white',\r
73 fontWeight: 'bold',\r
74 field: 'gaming',\r
75 display: 'insideEnd'\r
76 },\r
77 renderer: 'onSeriesRender'\r
78 }],\r
79 sprites: [{\r
80 type: 'text',\r
81 text: 'Profits and Losses',\r
82 fontSize: 22,\r
83 width: 100,\r
84 height: 30,\r
85 x: 40, // the sprite x position\r
86 y: 20 // the sprite y position\r
87 }]\r
88 }\r
89\r
90});