The EQ graph has these requirements:
It has four adjustable "dot" controls that can be moved to any X/Y location in the graph.
Each dot control has a colored curve that has to be drawn based on its location in X/Y coordinates.
An additional graph curve has to be drawn that is the sum of the four curves.
The overall dimensions can be adjusted to any size.
The X and Y scales can be defined to be any values using linear or logarithmic scales.
Each dot has some additional parameters associated it that are used by the EQ graph math calculations.
The background color can be defined.
The scales and grid and text must have a color that can be defined.
The dots can be adjusted using multiple touches on a touchscreen browser such as iPad, iPhone, Android tablet, or Android phone.
The dots can be adjusted using a mouse on a computer browser.
The color and opacity of each dot curve can be defined.
The Graph should look exactly as it is shown on the images. The image 1 (1eq.png) shows the default state of the graph. There are 8 images (1eq.png - 8eq.png) that show different state of the dots. The opacity of the colored overlay is 35-40%.
There are also 2 images of the basic graph we already have. That is the starting point you will use to implement the EQ graph. It has four adjustable dots and simply draws a line between the dots.