Index

A

• AbstractChart class
  • used, for styling chart / Chart
• amCharts
  • about / amCharts
  • chart, creating / amCharts
• Annotation
  • about / Creating custom interactions
  • creating / Annotating a chart
• architecture, Sencha Charts / Architecture of Sencha Charts
• area chart
  • creating, with line stroking / Creating an area chart with line stroking
  • creating, with fill / Creating an area chart with fill
• axis
  • styling / Axis
  • grid lines, displaying / Displaying grid lines
  • line, styling / Styling an axis line
  • labels, styling / Styling axis labels
  • custom label, displaying / Displaying a custom label

B

• background, chart
  • coloring / Coloring the background
  • image, using / Image
  • color gradient, using / Gradient
  • color, using / Color
• built-in interactions
  • using / Using built-in interactions
  • Crosshair / Using built-in interactions
  • CrossZoom / Using built-in interactions
  • ItemHighlight / Using built-in interactions
  • PanZoom / Using built-in interactions
  • Rotate / Using built-in interactions
  • RotatePie3D / Using built-in interactions

C

• CandleStick chart
  • about / A walkthrough of an existing CandleStick chart
  • Stock App, design / Design of the Stock App
  • sequence diagram / The sequence diagram
• Cartesian.js file
  • about / Getting ready
• cartesian chart
  • about / Types of charts, Architecture of Sencha Charts
  • creating / Creating a cartesian chart
• chart
  • creating / Creating a chart
  • axes / Axes
  • label, drawing on axis / Axis label
  • bar chart, cretaing with marker / Bar chart with a marker
  • area chart, creating with line stroking / Creating an area chart with line stroking
  • area chart, creating with fill / Creating an area chart with fill
  • crosshair lines / Crosshair lines
  • browser-wise support, URL / Crosshair lines
  • anatomy / Anatomy of a chart
  • theming / Theming your chart
  • styling, AbstractChart class used / Chart
  • framing / Framing
  • background, coloring / Coloring the background
  • series color, modifying / Changing the color of the series
  • room, creating from sides / Creating room at the sides
• classes, custom charts
  • Axis (Ext.chart.axis.Axis) / Architecture of Sencha Charts
  • Legend (Ext.chart.Legend) / Architecture of Sencha Charts
  • Markers (Ext.chart.Markers) / Architecture of Sencha Charts
  • Grid (Ext.chart.grid.*) / Architecture of Sencha Charts
  • Interaction (Ext.chart.interactions.Abstract) / Architecture of Sencha Charts
  • Theme (Ext.chart.theme.Theme) / Architecture of Sencha Charts
• classes, Market Clock
  • SCE.chart.MarketClock / Structuring the design
  • SCE.series.MarketClock / Structuring the design
  • SCE.sprite.MarketClock / Structuring the design
• classes, Sencha Charts package
  • Chart (Ext.chart.AbstractChart) / Architecture of Sencha Charts
  • Series (Ext.chart.series.Series) / Architecture of Sencha Charts
  • Sprite (Ext.draw.sprite.Sprite) / Architecture of Sencha Charts
  • Draw (Ext.draw.Container) / Architecture of Sencha Charts
  • Surface (Ext.draw.Surface) / Architecture of Sencha Charts
  • Engine (Ext.draw.engine.Canvas/Ext.draw.engine.Svg) / Architecture of Sencha Charts
• construction and initialization stage, CandleStick chart
  • preview, with RangeMask / Preview with RangeMask
  • CandleStick / CandleStick
• Crosshair
  • about / Using built-in interactions
  • axes configs / Using built-in interactions
  • lines configs / Using built-in interactions
• CrossZoom
  • about / Using built-in interactions
• CSS
  • using / Theming using SASS and CSS
• custom charts
  • classes / Architecture of Sencha Charts
• custom interactions
  • creating / Creating custom interactions
  • Trendline / Creating custom interactions
  • Annotation / Creating custom interactions
  • ItemHighlight / Creating custom interactions
  • trend line, displaying / Displaying a trend line
  • Annotation, creating / Annotating a chart
  • more details of series item, displaying / Displaying more details of a series item
• custom theme
  • using / Theming using a custom theme

E

• Exponential Moving Average (EMA)
  • about / What is this chart all about?
• Ext.draw.Surface class / Sencha Charts Surface API

F

• financial chart
  • creating / Creating a new financial chart
  • technical requirement, deriving / What is this chart all about?
  • MACD chart design, structuring / Structuring the MACD chart design
  • MACD chart, implementing / Implementing a MACD chart
  • MACD chart, using in application / Using MACD in an application
• FusionCharts
  • about / FusionCharts
  • chart, creating / FusionCharts

G

• gauge series, space filling chart / A walkthrough of a spacefilling chart – gauge
• Google Charts
  • about / Google Charts
  • chart, creating / Google Charts

H

• HighCharts
  • about / HighCharts
  • chart, creating / HighCharts

I

• implementation, Market Clock
  • SCE.store.MarketTimings class, using / SCE.store.MarketTimings
  • SCE.sprite.MarketClock class, using / SCE.sprite.MarketClock
  • SCE.series.MarketClock class, using / SCE.series.MarketClock
  • SCE.chart.MarketClock class, using / SCE.chart.MarketClock
  • SCE.view.main.Main class, using / SCE.view.main.Main
• implementation, periodic table
  • SCE.store.PTElements class / SCE.store.PTElements
  • SCE.model.PTElement class / SCE.model.PTElement
  • SCE.sprite.PeriodicTableElement class / SCE.sprite.PeriodicTableElement
  • SCE.series.PeriodicTable class / SCE.series.PeriodicTable
  • SCE.view.main.Main class / SCE.view.main.Main
• interactions
  • working with / Interacting with interactions
• ItemHighlight
  • about / Using built-in interactions, Creating custom interactions

L

• layers, rendered on surfaces
  • Background / Architecture of Sencha Charts
  • Main / Architecture of Sencha Charts
  • Grid / Architecture of Sencha Charts
  • Series / Architecture of Sencha Charts
  • Axis / Architecture of Sencha Charts
  • Chart / Architecture of Sencha Charts
  • Overlay / Architecture of Sencha Charts
  • Events / Architecture of Sencha Charts
• legend
  • styling / Legend
• legend support, Market Clock
  • adding / Adding legend support
  • legend, displaying / Displaying the legend
  • sprite visibility, controlling / Controlling the sprite visibility
  • sectors, centering / Centering the sectors
  • sectors, limiting / Limiting the sector within the clock

M

• MACD
  • reference link / Creating a new financial chart
• MACD chart
  • technical requirement, deriving / What is this chart all about?
  • design, structuring / Structuring the MACD chart design
  • implementing, with SCE.sprite.MACD class / SCE.sprite.MACD
  • implementing, with SCE.series.MACD class / SCE.series.MACD
  • implementing, with SCE.chart.MACD class / SCE.chart.MACD
  • using, in application / Using MACD in an application
• Market Clock
  • creating / Creating a Market Clock
  • requisites / What is this chart all about?
  • design, structuring / Structuring the design
  • implementing / Implementing the Market Clock
  • legend support, adding / Adding legend support

P

• PanZoom
  • about / Using built-in interactions
• periodic table
  • creating / Creating a periodic table
  • reference link / Creating a periodic table
  • requisites / What is this chart all about?
  • design, structuring / Structuring the design
  • implementing / Implementing the periodic table
  • color selection, standardizing / Standardizing the color selection
  • store, updating / Working with store updates
  • resizing / Resizing
• Pie.js file
  • about / Getting ready
• Polar.js file
  • about / Getting ready
• polar chart
  • about / Types of charts, Architecture of Sencha Charts
  • creating / Creating a polar chart
  • radar series / A walkthrough of a polar chart – radar

R

• radar series, polar chart / A walkthrough of a polar chart – radar
• renderer method / Creating a polar chart
• rendering stage, CandleStick chart / Rendering
• Rotate
  • about / Using built-in interactions
• RotatePie3D
  • about / Using built-in interactions

S

• sample chart
  • about / Introducing the sample chart
  • creating, with Canvas API / Canvas and SVG
  • creating, with SVG / Canvas and SVG
• sample chart preparation
  • about / Preparation
  • line, creating / Creating a line
  • axis, creating / Creating an axis
  • axis label, creating / Creating an axis label
  • bar, creating / Creating a bar
  • marker, creating on bar / Creating a marker on the bar
• SASS
  • using / Theming using SASS and CSS
• SCE.chart.MACD class
  • about / Structuring the MACD chart design
  • used, for implementing MACD chart / SCE.chart.MACD
• SCE.chart.MarketClock class
  • about / Structuring the design
  • implementing / SCE.chart.MarketClock
• SCE.model.PTElement class
  • implementing / SCE.model.PTElement
• SCE.series.MACD class
  • about / Structuring the MACD chart design
  • used, for implementing MACD chart / SCE.series.MACD
• SCE.series.MarketClock class
  • about / Structuring the design
  • implementing / SCE.series.MarketClock
• SCE.series.PeriodicTable class
  • about / Structuring the design
  • implementing / SCE.series.PeriodicTable
• SCE.sprite.MACD class
  • about / Structuring the MACD chart design
  • used, for implementing MACD chart / SCE.sprite.MACD
• SCE.sprite.MarketClock class
  • about / Structuring the design
  • implementing / SCE.sprite.MarketClock
• SCE.sprite.PeriodicTable class
  • about / Structuring the design
• SCE.sprite.PeriodicTableElement class
  • implementing / SCE.sprite.PeriodicTableElement
• SCE.store.MarketTimings class
  • implementing / SCE.store.MarketTimings
• SCE.store.PTElements class
  • implementing / SCE.store.PTElements
  • record structure / SCE.store.PTElements
• SCE.view.main.Main class
  • implementing / SCE.view.main.Main, SCE.view.main.Main
• Sencha Charts
  • cartesian charts / Types of charts
  • polar chart / Types of charts, Architecture of Sencha Charts
  • space filling charts / Types of charts
  • sprite / Anatomy of a chart
  • series / Anatomy of a chart
  • axis / Anatomy of a chart
  • legend / Anatomy of a chart
  • chart / Anatomy of a chart
  • theming / Theming your chart
  • architecture / Architecture of Sencha Charts
  • cartesian chart / Architecture of Sencha Charts
  • space filling chart / Architecture of Sencha Charts
• Sencha Charts package
  • classes / Architecture of Sencha Charts
• Sencha Charts Surface API
  • about / Sencha Charts Surface API
  • axes / Axes
  • axis label / Axis label, bars, and markers
  • markers / Axis label, bars, and markers
  • bars / Axis label, bars, and markers
  • area chart, creating / Area chart
  • crosshair, creating / Creating the crosshair
• sequence diagram, CandleStick chart
  • construction and initialization stage / Construction and Initialization
  • rendering stage / Rendering
• series
  • styling / Series
  • animating / Animating a series
  • colors, using / Using our own color
  • highlighting / Highlighting
  • sprite, styling / Styling a series sprite
  • marker, styling / Styling the marker
  • rendering logic, customizing / Customizing the rendering logic
• space filling chart
  • about / Types of charts, Architecture of Sencha Charts
  • creating / Creating a spacefilling chart
  • gauge series / A walkthrough of a spacefilling chart – gauge
• sprite
  • styling / Sprite
• Stock App
  • design / Design of the Stock App
• stock market clock
  • reference link / Creating a Market Clock
• styling, using configs
  • about / Styling using configs
  • charts / Chart
  • axis / Axis
  • series / Series
  • sprite / Sprite
  • legend / Legend
• Surface / Crosshair lines

T

• theming
  • custom theme, using / Theming using a custom theme
  • SASS, using / Theming using SASS and CSS
  • CSS, using / Theming using SASS and CSS
• Trendline
  • about / Creating custom interactions
• trend line
  • about / Displaying a trend line
  • displaying / Displaying a trend line
  • URL / Displaying a trend line

U

• users
  • enabling, to chart interaction / Engaging users with gestures

X

• XTemplate, data fields
  • name / Displaying the legend
  • mark / Displaying the legend
  • disabled / Displaying the legend