Unlike other charts, Stock Chart supports only CSV (Comma-Separated Values) data. Flexible stock chart settings will allow you to adopt almost any CSV data without even modifying it.
For example, let's go to Yahoo finance and get some NASDAQ historical prices - select a date range and click the "Download To Spreadsheet" link in the bottom of the page. Save the CSV file and open it with a text editor. You will see the following:
Date,Open,High,Low,Close,Volume,Adj Close
2008-08-27,2362.86,2395.02,2358.93,2382.46,1540700000,2382.46
2008-08-26,2364.31,2377.04,2345.79,2361.97,1256980000,2361.97
2008-08-25,2399.73,2399.73,2362.20,2365.59,2366920000,2365.59
2008-08-22,2390.34,2417.63,2390.34,2414.71,1365910000,2414.71
2008-08-21,2371.54,2387.72,2360.39,2380.38,1562430000,2380.38
…………………………………………………….
Now you need to set up your settings so that the stock chart can accept this file. Here are the step-by-step instructions:
1) Set the file name for your data set:
<data_sets>
<data_set>
<file_name>data.csv</file_name>
This file should be located in the folder that is specified as "path" in this line of your HTML code: so.addVariable("path", "amstock/"); By default, you should place the data file in the "amstock" folder.
2) The configuration of the CSV data in the settings file is made within the <csv> section of a <data_set>. Locate these lines in the settings file.
3) Now, let's take a look at the data. The first line doesn't contain data, only the column names. You have two choices: a) delete this line; b) set <skip_first_rows>1</skip_first_rows> so that this line will be ignored.
4) Notice that your data starts with the latest date at the top. By default, Stock Chart expects the opposite - the oldest date should be at the top. To handle this, you should set: <reverse>true</reverse>
5) As you see, the columns are separated by comma. Set the separator in the <separator>,</separator> setting.
6) Now you must describe the date format used in this data file. It's YYYY-MM-DD. You can describe it in the <date_format>YYYY-MM-DD</date_format> setting. Actually, this is the default date format of Stock Chart, so in this case you can simply delete this setting.
6) Now it's time to describe your columns. Your data file should have at least two columns - date and one value column. The date column's name must be "date", the others may be called anything. As the date is in the first column, you should add <column>date</column> right after the <columns>:
<columns> <column>date</column> </columns>
You will need to specify the names for all the columns that you are going to use. Assume that you will have two charts: candlestick and volume. You will use all the columns except "Adj close". You can use the same names as in the top of the data file:
<columns> <column>date</column> <column>open</column> <column>high</column> <column>low</column> <column>close</column> <column>volume</column> </columns>
You will not be using the "Adj close" column, so you did not describe this column at all. If this column was to go before the "volume" column, the settings would look like this:
<columns> <column>date</column> <column>open</column> <column>high</column> <column>low</column> <column>close</column> <column></column> <column>volume</column> </columns>
That's it, the chart will accept and parse this data properly. The full settings will look like the following:
<data_sets>
<data_set>
<csv>
<skip_first_rows>1</skip_first_rows>
<reverse>true</reverse>
<separator>,</separator>
<date_format>YYYY-MM-DD</date_format>
<columns>
<column>date</column>
<column>open</column>
<column>high</column>
<column>low</column>
<column>close</column>
<column>volume</column>
</columns>
</csv>
</data_set>
</data_sets>
We did not use all the available settings to set up this data. There are two others:
<skip_last_rows></skip_last_rows>
Allows you to define the number of rows from the end of the file that will be ignored.
<show_last_rows></show_last_rows>
Allows you to define the number of rows, counting from the last one, that will be used. All the rows above will be ignored.
| © Antanas Marcelionis Contact and feedback: info@amcharts.com | Subscribe to amCharts news |