Rendering a bar graph in JavaScript using D3.js
We will use the portable JavaScript library called
D3.js
to draw a bar graph. This allows us to easily create a web page that contains a graph from the Haskell code.
Getting ready
An Internet connection is necessary for the setup.
Install the d3js
Haskell library as follows:
$ cabal install d3js
Create a website template to hold the generated JavaScript code as follows:
$ cat index.html
The JavaScript code will be as follows:
<html> <head> <title>Chart</title> </head> <body> <div id='myChart'></div> <script charset='utf-8' src='http://d3js.org/d3.v3.min.js'></script> <script charset='utf-8' src='generated.js'></script> </body> </html>
How to do it…
Import the relevant packages as follows:
import qualified Data.Text as T import qualified Data.Text.IO as TIO import D3JS
Create a bar chart using the
bars
function. Feed the specified values and...