Perforce JViews Charts Sample: Stock Viewer
Description
This sample allows you to display the stock quotes of one or several companies, as well as several technical market indicators. Two kinds of charts are used to display the stock data:
- The upper chart, which displays the stock data of the company being analyzed. Several other companies can be displayed in overlay,as well as indicators such as moving averages.
- Two lower charts, each of them displaying one technical indicator (Volume, RSI,MACD, and so on).
How to Use the Sample
The left scale of the upper chart displays the stock price.
When a single symbol is selected, a secondary y-scale is displayed at
the right-hand side of the chart. This scale displays the percentage
variation of the stock price according to the first quote in the
current time period. A dashed grid line is also drawn to locate the
reference price.
You can also perform a zoom by clicking with the left mouse button on
the x-scale and dragging over the desired period. The selected time
interval will automatically snap to the steps of the scale.
A Pan interactor is also set by default on all the charts.
With this interactor, you can pan along the x-axis with the right
mouse button.
Note:
All these interactions are disabled when a local zoom is set.
In addition to these controls, two dedicated interactors are set on
the chart. These interactors let you change the zoomed area in the
following ways:
Obtaining an API Key
In order to retrieve stock information from the Barchart web site,
you must first register for a free API key. Visit:
https://www.barchart.com/ondemand/free-market-data-api
to generate your key, then use the Authentication menu
to make it known to this sample.
Loading Quotes
The loading of quotes is specified by the controls available in the
query panel:
Quotes are automatically loaded when the duration or the frequency of
the query are modified. However, an explicit reload request must be made
after changing the ticker symbols. To request an explicit reload of the
stock data, press the
toolbar button.
Daily
and
Weekly
.
Using Technical Indicators
The Indicators menu lets you specify the technical indicators
that must be displayed by the charts. These indicators are split into
two categories:
Volume
, MACD
,RSI
,
and so on).
Controlling the visible range
Interactors
A Zoom interactor is set by default on the upper chart. To
perform a zoom, simply click on the left mouse button and drag the
mouse over the desired time interval. During the interaction, the
y-range of the zoomed data window is automatically computed so that it
contains all the data displayed within the specified time frame.
The Zoom History
Whenever a zoom is performed, the previous zoom level is stored in the
zoom history. You can browse the zoom history with the following toolbar
buttons:
To go back to the previous zoom level.
To move forward to the next zoom level.
To fit the zoom level to the chart contents, and
reset the zoom history.
Using the Local Zoom
This special feature of Perforce JViews Charts lets you define a zoom on a
local area of a chart. In the demonstration, you can specify a zoom
factor for a given time interval. Using this mechanism, you can focus
on a data subset while keeping an overview of the remaining values.
The following toolbar buttons can be used to control the local zoom:
Lets you activate or deactivate the local
zoom.
Increases the zooming factor within the local
area.
Decreases the zooming factor within the local
area.
Note:
All the operations affecting the visible range of the chart
are disabled when the local zoom is set.
Using Threshold Lines
Threshold lines let you specify upper and lower price limits within the main chart. You can activate and deactivate the threshold lines with the toolbar button.The threshold limits can be edited with the range slider located in the toolbar (this slider only appears when threshold lines are used).
When threshold lines are activated, the rendering style of the data points depends on their price value:
- A green color is used for values above the upper limit.
- A red color is used for values below the lower limit.
- An orange color is used for values between the two limits.
Controlling Display Properties
The following properties are accessible through the Display menu:- The Overview Representation submenu lets you choose the chart representation of the primary symbol when it is inoverview mode. This mode is set when the visible time range exceeds a duration of approximately three months for daily data, and approximately one year for weekly data. Four representation types are available: Line, Area, Stair, andBar.
- The Detailed Representation submenu lets you choose the chart representation of the primary symbol when it is indetailed mode. This mode is set when the visible time range is below the limits mentioned above. Two representation types are available: Candle and HLOC (High-Low-Open-Close).
- The Anti-aliasing item lets you toggle anti-aliased drawing for all the charts.
- The Logarithmic Price Axis item lets you specify whether the y-scale of the quote chart is logarithmic or linear.
How to Run the Sample as an Application
This sample can
be run as an application.
The installation directory contains
an executable JAR file,
stock.jar
,
that allows you to execute the sample with a double click from a
file browser. Note that if you are using Internet Explorer, you can
open the installation directory
and execute the JAR file from the browser. This
technique may not work in other Web browsers.
Alternatively, you
can run the sample application from the command line.
First check that the Ant utility is properly configured. If not, see the
instructions on how to configure Ant for Perforce JViews.
Then, go to the installation directory
of the sample and type:
ant run
Topics Covered
- Synchronization of several data sets using listeners.
- Customization of the style computed by a rendering hint by subclassing the IlvGradientRenderingHint class.
- Axis sharing.
Detailed Description
The sample loads stock information from barchart.com and displays
it in charts on which you can perform interactions. The data is retrieved
by sending a formatted query to the Barchart web site and decoding the
result using a custom IlvDataReader
object (instance of
CSVDataReader
).
This reader extracts the data from the input stream and initializes the data
source with the corresponding data sets.
In addition to the stock prices and volume information, several technical
indicators can also be visualized.
These technical indicators are handled through specialized datasets
(instances of IlvDataSet
custom implementation) and data
source (instances of IlvDataSource
custom implementations)
objects.
The quotes are displayed through two different kinds of renderers,
depending on the zoom level: either as a polyline chart or as a hilo chart.
The zoom level checking is performed through an axis listener that
monitors axis range changes: each time the x-axis visible range of the
quote chart changes, the visibility of the hilo and polyline renderers is
toggled accordingly.
To zoom only part of the chart, a local zoom transformer can be set on the
x-axis so that only data within the specified interval is zoomed, without
changing the current visible range.
To have a visual feedback of the zoomed area, several decorations and
annotations can be associated to this local zoom.
These decorations are handled by a dedicated class
(LocalZoomHandler
) that installs indicators
(IlvDataIndicator
) to visualize the extent of the zoomed
area as well as scale annotation (IlvScaleAnnotation
) to
show the zoomed area bounds in the scale.
There are two kind of zoom interactions on the upper chart:
- by means of a subclass of
IlvChartZoomInteractor
that modifies the dragged area so that the resulting zoomed area includes all the data contained within the selected time interval - by means of a subclass of
IlvChartInteractor
that handles interactions on the scale itself, to be able to zoom in a given time interval (the selection of this interval being done step-by-step according to the scale steps definition).
Threshold lines let you specify upper and lower price limits within the
main chart, to change the rendering style of the stock price curves
accordingly. The Threshold lines are implementation of
IlvDataRenderingHint
and are rendered through
IlvDataIndicator
s and IlvScaleAnnotation
s
objects.
Installation Directory
The Stock Viewer sample is installed here.
Classes Involved
- ilog.views.chart.data.IlvDataReader
- ilog.views.chart.data.IlvInputDataSource
- ilog.views.chart.renderer.IlvHiLoChartRenderer
- ilog.views.chart.renderer.IlvPolylineChartRenderer
- ilog.views.chart.interactor.IlvChartZoomInteractor
- ilog.views.chart.interactor.IlvChartPanInteractor
- ilog.views.chart.interactor.IlvChartLocalPanInteractor
- ilog.views.chart.IlvLocalZoomAxisTransformer
- ilog.views.chart.IlvScaleAnnotation
- ilog.views.chart.graphic.IlvDataIndicator
Source Files
- stock.StockDemo
- stock.StockDataSource
- shared.CSVDataReader
- stock.StockQueryRange
- stock.CategoryTimeSteps
- stock.LocalZoomHandler
- stock.SharedGrid
- stock.Stripes
- stock.ThresholdLines
- stock.ZoomScaleInteractor