![chartcryptocurrencyinvcl | Embarcadero RAD Studio Delphi C++Builder Blogs chart cryptocurrency in vcl](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/chart_cryptocurrency_in_vcl-7919824-scaled.jpg?resize=1140%2C694&ssl=1)
Table of Contents
Coins, wallets and the tale of very big numbers
It’s hard to miss the tidal wave of stories about cryptocurrency. The inexorable rise of BitCoin, Ethereum, and a whole stable of others, and the volatility where fortunes are made – and lost – has ensured it is the hot technical topic of the day. You can even apparently soon pay for a Tesla with cryptocurrency. In this article, we’ll use Windows Ui Toolkit for charts, graphs, bars, and VCL Styles to visualize that volatility by plotting the ups and downs of various virtual cryptocurrencies against good old hard cash. It’s surprisingly easy to do!
Charts, graphs and bars
In this article, we are going to use Steema TeeChart for the charting functions. The RAD Studio Delphi VCL framework comes with a built-in TeeChart Std. It doesn’t have some of the additional bells and whistles of the TeeChart Pro version, but it’s enough to produce some really functional examples.
For other platforms such as Firemonkey TeeChart Lite is provided, but it has a few features that aren’t included which we would for our purposes. To overcome this, you can install the Teechart Pro trial version from https://www.steema.com. The trial versions are fully functional with the only limitation that a small nag screen appears when you first run them.
Where are we going to get the cryptocurrency data from?
We’re going to use the TFDMemTable ExchangeMemTable
components to provide the data to the charts. This table contains three fields:
- Date
- USD_BTC (USD for one Bitcoin)
- USD_ETH (USD for one Ethereum)
At runtime, we can retrieve actual data from the Web, or load it from some predefined files.
At design time, the table comes with 12 records – last year per month.
More details about the table filling see below.
Creating our cryptocurrency chart
Create a blank VCL form and drop TDBChart on it:
![image4330251 | Embarcadero RAD Studio Delphi C++Builder Blogs image 4330251](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-4330251.png?resize=159%2C65&ssl=1)
Click with your right mouse and select “Edit Chart”:
![image6032717 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting 1](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-6032717.png?resize=565%2C287&ssl=1)
On “Series”, select “Add”
![image5706993 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting 2](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-5706993.png?resize=364%2C148&ssl=1)
Now select “Bar” and press “OK”
![image8889511 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting choose a chart type](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-8889511.png?resize=681%2C489&ssl=1)
We have a sample chart!
A sample TeeChart bar appears. Now, expand “Series”, select “Series1”, choose “Data Source” and select “Dataset”
![image9661245 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting random range](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-9661245.png?resize=391%2C212&ssl=1)
Select ExchangeMemTable
, Date for X, USD_BTC for Bar. Press the “Apply” button.
Our 12-month data appears.
![image9528352 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting BTC bitcoin](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-9528352.png?resize=750%2C262&ssl=1)
Tidying some loose ends
For this task, probably, we do not need Legend. Uncheck Visible for it:
![image8249164 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting turn off the legend](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-8249164.png?resize=750%2C272&ssl=1)
Probably, we do not need also marks, left axis is enough. Uncheck “Visible” for them:
![image8092580 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting chart example](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-8092580.png?resize=750%2C283&ssl=1)
Trying out other charts
We can easily select another chart style for the same data. Press “Change” for Series1:
![image2157159 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting alternate chart styles](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-2157159.png?resize=495%2C242&ssl=1)
Now, select “Line”
![image5225134 | Embarcadero RAD Studio Delphi C++Builder Blogs image 5225134](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-5225134.png?resize=519%2C311&ssl=1)
Adding additional cryptocurrencies to our VCL chart example
Now, let us add another cryptocurrency. In “Series”, press Add:
![image2287126 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting VCL example](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-2287126.png?resize=470%2C100&ssl=1)
Choose “Line”. For Series2, select “Dataset” – ExchangeMemTable
, Date for X, USD_ETH for Y and then press “Apply” to make the chart sprint into life.
![image4980892 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting ribbon graph](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-4980892.png?resize=750%2C255&ssl=1)
Adjusting for cryptocurrency variations on the example VCL chart
Ethereum (ETH) values are significantly smaller than BitCoin (BTC). To improve the scaling and provide a better comparison let’s expand “ETH” to a full chart size. Let us give ETH a separate axis on the right side:
![image7900762 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting again](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-7900762.png?resize=750%2C277&ssl=1)
How to fetch live cryptocurrency data into our VCL chart example
![image7805397 | Embarcadero RAD Studio Delphi C++Builder Blogs Cryptocurrency Charting how to fill from the network with live data](https://i0.wp.com/blogs.embarcadero.com/wp-content/uploads/2021/05/image-7805397.png?resize=357%2C193&ssl=1)
To fill the ExchangeMemTable
with actual rates from the currency exchange, you should get a free key from https://coinlayer.com/. Enter this key in the editor field. Select an appropriate time period (last year, last month, last week) and step (month, week, number of days) and then choose “Fill from network”.
Data operations are placed in a modal dialog. To invoke it, press “Data manipulation” in the main form.
How do we get the data?
The networking code is located in a separate data module. This code comes from the Embarcadero blog article Automate Access To Current And Historical Currency Exchange Rates Via API, with some small modifications. Look in the data module of the example code where the exact process is explained in the code comments.
Get the full working example code here on GitHub.
Learn about the C++ vector erase method of wstring and how you can solve 5 diagonal matrix forms.
Are you ready to chart the white-knuckle rollercoaster ride of cryptocurrencies in your Windows applications?
Design. Code. Compile. Deploy.
Start Free Trial Upgrade Today
Free Delphi Community Edition Free C++Builder Community Edition