Creating a periodic table
In this section, you will see how to create a periodic table, shown as follows, where we show the atomic number and symbol for each element.
Note
You can read more about this at http://en.wikipedia.org/wiki/Periodic_table.
The following diagram shows the typical periodic table that we would like to create:
What is this chart all about?
From a charting perspective, our periodic table will have the following requirements:
It has 18 columns
For each element, we will show the atomic number and symbol
Lanthanide and Actinide elements are displayed separately
Lanthanides will be shown in green
Actinides shall be shown in blue
All other elements will be shown in black
With these requirements in place, let's get to the design and implementation of it.
Structuring the design
The following diagram shows the specific classes that we need to implement to create our periodic table and how they are connected with Sencha Charts classes:
The classes highlighted with a gray background are related...