====== Using events ======
If you check [[http://www.amcharts.com/stock/events/|this example]], you will notice that both charts contain bullets. You can roll over the bullets to see their description, and they can also be linked to some web page.
For a better understanding of events, check the examples/events example from a downloaded package.
Event bullets are added using XML code. You can place this code directly inside the data_set tag of the settings file, or you can have a separate file just for the events code.
.............
.............
events.xml
Like data and settings files, the events file can be [[v.1:stock:data:dynamic_data|generated dynamicaly]], and you can use any extension. It is only important that it outputs XML data.
The structure of the events XML code is simple:
.......
.......
.......
As you see, you simply add an section for every event.
====== Available event settings ======
second
volume
right
2007-01-16
pin
50
true
12
80
-6
^Setting^Available values^Default value^Description^
|eid (attribute of )|Numer or string|none|The event id (eid) is passed to a Javascript function when you roll over or click on an event bullet. If you are not using this, you can leave out this attribute.|
||Number or string|cid of the first chart|As there can be any number of charts, you have to specify the chart_id. If the chart_id is not specified, the event is assigned to the first chart. The chart_id can be set in the settings file, as the cid attribute: . If you don't set the cid for the chart, the cid is assigned automatically, sequentially, starting from 0.|
||Number or string|gid of the first graph|As there can be any number of graphs, you have to specify the graph_id. If the graph_id is not specified, the event is assigned to the first graph. The graph_id can be set in the settings file, as the gid attribute: If you don't set the gid for the graph, the gid is assigned automatically, sequentially, starting from 0.|
||Right/left|left|The Y axis that will be used to place a horizontal line event.|
||Date tag|none|Date of the event. You have to use the same date format as set in data_set settings.|
||sign, flag, pin, round, square, round_outlined, square_outlined, round_outline, square_outline, horizontal_line, vertical_line, horizontal_line_dashed, vertical_line_dashed|As set in |The shape of the bullet. Only the sign, flag and pin bullets can display letters inside them.|
||hex color code|As set in |The color of a bullet.|
||hex color code|As set in |The color of a bullet border.|
||Number, in percent|As set in |The opacity of a bullet border.|
||hex color code|As it is set in |Color of a letter inside the bullet.|
||String|none|The letter which will be displayed in a bullet (only if you use sign, flag or pin bullets).|
||Text|none|The description of an event. It will be displayed in the balloon when the viewer rolls over the bullet.|
||web page address|none|The address of a web page where the viewer will sent if he clicks on the bullet.|
||true/false|false|If this is set to true, the event bullet will be placed on the axis, instead of on the graph line.|
||Number|12|The size of a bullet, in pixels.|
||Number|none|The Y axis coordinate of the event. If this is not set, the event will be displayed on the graph line itself.|
||Number|none|The Y axis coordinate of the event, if the graph values have been recalculated to percent.|
====== Events and JavaScript ======
When the chart viewer rolls over the event bullet, the following Javascript command is called:
amRolledOverEvent(date, description, id, url)
When the chart viewer clicks on an event bullet, the following Javascript command is called:
amClickedOnEvent(date, description, id, url)
The ID passed to these functions is the "eid" attribute of an event.
These functions can be useful in various cases, for example if instead of showing the event description in the balloon, you want to have a separate area for news on your page.
There are two JS functions that can be used to show or hide an event: flashMovie.showEvents() and flashMovie.hideEvents()