Using trend lines

Please check this example for the demonstration on how trend lines work in amStock.

For a better understanding of trend lines, check the examples/drawing_trend_lines example from a downloaded package.

Trend lines can be placed on the plot area either by supplying the data through settings/trendlines file or by user physically drawing them on the chart.

To enable trend lines editing set the <trend_lines><drawing_enabled> to true.

trend line data can also be 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 trend lines data.

<data_sets>
   <data_set>
      <trend_lines>
         .............
      </trend_lines>
      .............
      <trend_lines_file_name>trend_lines.xml</trend_lines_file_name>

Like data and settings files, the trend lines file can be 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:

<trend_lines>
   <trend_line>
      .......
   </trend_line>
 
   <trend_line>
      .......
   </trend_line>
 
   <trend_line>
      .......
   </trend_line>
</trend_lines>

As you see, you simply add an <trend_line> section for every trend line.

Available trend line settings

<trend_line>
    <date0>2007-11-19</date0>
    <date1>2008-02-01</date1>
    <value0>2593.38</value0>
    <value1>2413.36</value1>
    <line_color></line_color>
    <line_alpha></line_alpha>
    <line_width></line_width>
    <dash_length>5</dash_length>
    <axis></axis>
    <chart_id>0</chart_id>
    <locked></locked>
</trend_line>

Setting	Available values	Default value	Description
<date0>	Date/time	none	Initial trend line date
<date1>	Date/time	none	Last trend line date
<value0>	Number	none	Initial trend line value
<value1>	Number	none	Last trend line value
<line_color>	hex color code	#00CC00	Line color
<line_alpha>	0-100	100	Alpha of the line
<line_width>	Number	0	Width of the line. (use 0 for hairline)
<dash_length>	Number	0	Width of the dash. (use 0 for non-dashed line)
<axis>	left/right	left	Axis of the line.
<chart_id>	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 trend line is assigned to the first chart. The chart_id can be set in the settings file, as the cid attribute: <chart cid="first">. If you don't set the cid for the chart, the cid is assigned automatically, sequentially, starting from 0.
<locked>	true/false	false	If locked is set to true, this trend line won't be deleted when user clicks on the eraser button

Trend lines and JavaScript

The following functions can be used to control trend lines dynamically.

flashMovie.setTrendLines(trend_lines, [remove_old])

This function allows adding trend lines at a runtime. Use default trend line XML syntax: <trend_lines><trend_line>….</trend_line></trend_lines>. If you set the remove_old to true, the old trend_lines will be removed. Default value is "false".

flashMovie.setTrendLines("<trend_lines><trend_line><date0>2008-03-10</date0><date1>2008-04-11</date1><value0>119.69</value0><value1>147.14</value1><axis>right</axis></trend_line></trend_lines>");

flashMovie.hideTrendLines()

This function will hide trend lines.

flashMovie.showTrendLines()

This function will show the hidden trend lines.

Back to top