Task: Complete each of the tasks below.

Task $1$: Code Setup

A$.$ Your program must be created as a Node.js project that serves a web

application using express.js framework

B$.$ The objective of the program is to allow users to generate a bar or a pie chart

C$.$ Your program must be written using separate HTML$,$ Javascript and CSS files

Task $2$: You should design your app based on the following set of requirements

$$ Your program must allow the user to pick whether they want a pie chart or a

bar chart

$$ Based on the chart type user input you need to draw the chart according to

the specifications that the user gave for each chart type.

Task $3$: Pie Chart Requirements

$$ Your program must allow the user to specify

$$ title of the chart

$$ number of sectors $(2$ to $6)$

$$ total value of all sectors combined

$$ label of sector $1,$ value of sector $1,$ label of sector $2,$ etc.

$$ for the last sector:

$$ only let the user to provide the label but not the value $($because the

program can calculate the value of the last sector based on all of the

other information that was given by the user$)$

$$ The pie chart must be roughly in the centre of the window:

$$ the title $($decided by the user$)$ of the pie chart should be centered at the

length

$$ the diameter should be between $300$ and $500$ pixels

$$ the chart should be able to handle from $2$ to $6$ sectors

$$ the specific number of sectors is decided by the user

$$ the total value of the pie chart is decided by the user

$$ value of each sector is decided by the user, excluding the final

sector $-$ you can assume the sum of these values does not exceed

the total

$$ the value of the final sector should be calculated to complete the

pie chart

$$ each sector must have a name provided by the user

$$ each sector must have a unique colour

$$ there must be a legend for each sector

$$ each legend item includes

$$ a box indicating the colour of the sector and

$$ the corresponding label of that sector

$$ the legend labels and boxes should be positioned such that they

do not overlap

Task $4$: Bar Chart Requirements

$$ Your program must allow the user to specify

$$ title of the chart

$$ number of bars $(2$ to $6)$

$$ horizontal gridline interval $($between $10$ and $100$ inclusively$)$

$$ label for y$-$axis

$$ label of bar $1,$ value of bar $1,$ label of bar $2,$ value of bar $2,$ etc.

$$ Add proper restriction on all number inputs so that they fall within the

allowed range$($s$)$

$$ The bar chart must be roughly in the centre of the window:

$$ occupies most of the window with margins of about $100$ pixels on each

side

$$ has a title

$$ centred at the top of the chart

$$ the title is decided by the user

$$ has an x$-$axis and a y$-$axis

$$ has a label on the y$-$axis

$$ positioned to the left of the y$-$axis, centered vertically

$$ the label is decided by the user

$$ should not overlap with the chart, regardless of the length of the

label

$$ has horizontal gridlines

$$ incremental values of the gridlines are decided by the user

$$ e$.$g$.,$ user entered $50$: gridlines will be on $50,100,150,200,$ and so

on

$$ e$.$g$.,$ user entered $20$: gridlines will be on $20,40,60,80,$ and so on

$$ values of the gridlines must be displayed on the right side of the

chart

$$ The bar chart should be able to handle $2$ to $6$ bars

$$ value for each bar is decided by the user

$$ value must be displayed near the top of the bar

$$ you must restrict the maximum value for each bar is $400$

$$ each bar has a label decided by the user

$$ the label must be displayed below each corresponding bar

$$ the bars must have different colours

$$ the bars must be roughly evenly distributed across the xaxis $($e$.$g$.,$ if there are only two bars, they cannot be both on

the left side of the chart and leave the right side of the

chart empty.$)$

For full marks, your program must use:

$$ Google Chart Gallery $($LINK$)$ to display charts

$$ Your javascript code

$$ should be properly commented. This means

$$ making comments only where code needs further explanation