nnnick/Chart.js — pull request #51 by Regaddi (2013-03-23 15:25:50+00:00)
Title: Tooltips

I implemented some basic tooltips, which show (if defined) the label and value onmouseover.
Every tooltip can be registered by a configurable area:
1. a simple rectangle: (x,y,width,height)
2. a circle: (x,y,radius)
3. any shape: (array of {x,y} objects)

Tooltip Defaults can be overwritten by adding a 2nd parameter to the "new Chart()" function, i.e.

var myChart = new Chart(context, { background: 'black', fontColor: 'white' });

The following Tooltip options are available:

tooltipDefaults = {
background: 'rgba(0,0,0,0.6)',
fontFamily : "'Arial'",
fontStyle : "normal",
fontColor: 'white',
fontSize: '12px',
padding: {
top: 10,
right: 10,
bottom: 10,
left: 10
},
offset: {
left: 0,
top: 0
},
border: {
width: 0,
color: '#000'
}
}

The tooltip moves relative to the current mouse cursor position and shows only, if hovering a valid chart point or area.
Tooltips can be disabled via specific chart option "showTooltips" i.g.

myChart.Pie(pieChartData, { showTooltips: false });

They can be styled individually and do right now a basic job:
Showing the hovered label and value.

![Screenshot from 2013-03-23 16:25:00](https://f.cloud.github.com/assets/1336590/294046/e6d3014a-93cd-11e2-9901-2dcf290889b5.png)