Flotr2 Scatter Plot

We are using the Flotr2 library to make a scatter plot. ScatterPlot can be used to visualize the relation between two types of variables. In the scatter example, we are trying to see the relationship of death and birth rate. You can use size and color "coders" to give specific size and color to different data groups.
Note: Scatter and bar chart are quite similar in terms of settings.

To add a scatterplot to your exhibit, you must include the chart extension (after you include exhibit-api.js):

 <link rel="exhibit-extension" href="http://projects.csail.mit.edu/exhibit/extensions/flotrExtensions/flotr-extension.js"/>

To include a scatterplot, add to your HTML

 <div ex:role="view" 
       ex:viewClass="Exhibit.ScatterPlot" 
       ex:x=".birthrate"
       ex:y=".deathrate">
     </div>

Replace .birthrate and .deathrate with appropriate expressions.

Other settings (all preceded with ex:) include:

setting name	type of value	default	choices	meaning
plotHeight	int	400		Height of the plot in pixels
plotWidth	int	600		Width of the plot in pixels
color	text	#D95F0E	Any color in accepted html format	All the nodes in the graph will be of this color in the absence of color coders
colorCoder	text	null		id of a colorCoder
xLabel	text	x		Label for the X-axis
yLabel	text	y		Label for the Y-axis
xAxisType	enum	linear	linear, log	Scale for X-axis
yAxisType	enum	linear	linear, log	Scale for Y-axis
xAxisMin	float			Minimum value on X-axis
xAxisMax	float			Maximum value on X-axis
yAxisMin	float			Minimum value on Y-axis
yAxisMax	float			Maximum value on Y-axis
backgroundColor	text	white		Chart Background Color
yLabel	text	y		Label for the Y-axis
bubbleHeight	int	300		Height of the popUp in pixels
bubbleWidth	int	400		Width of the popUp in pixels