Fixed for the tooltips in a line chart. There is now a bigger hit area

trace/BarChart.js

@@ -17,10 +17,10 @@ define([
 	 * ## Options
 	 * - `showx`: Show or hide the X axis, defaults to `true`
 	 * - `showy`: Show or hide the Y axis, defualts to `true`
-	 * 
+	 *
 	 * @class  BarChart
 	 * @constructor
-	 * 
+	 *
 	 * @param {[type]} options [description]
 	 */
 	var BarChart = function (options) {
@@ -47,7 +47,7 @@ define([
 	 * Calculate the x and y functions
 	 *
 	 * We use the d3.layout.stack() and modify the data to be in the correct format
-	 * 
+	 *
 	 * @private
 	 */
 	BarChart.prototype._calculate = function () {
@@ -88,14 +88,14 @@ define([
 				return { x: d[0], y: +d[1], series: series };
 			});*/
 		}.bind(this));
-		
+
 		this.stacked = d3.layout.stack()(this.mappedData);
 
 		this.xfunc = d3.scale.ordinal().rangeRoundBands([0, width - margin[1] - margin[3]], 0.1);
 		this.yfunc = d3.scale.linear().range([height - margin[0] - margin[2], 0]);
 
 		this.xfunc.domain(this.stacked[0].map(function (d) { return d.x; }));
-		
+
 		var minnums = [], maxnums = [];
 		this.stacked.forEach(function (section) {
 			section.forEach(function (obj) {

trace/LineChart.js

@@ -194,8 +194,20 @@ define([
 					.attr('cx', function (d, i) { return this.xfunc(d[0]); }.bind(this))
 					.attr('cy', function (d, i) { return this.yfunc(d[1]); }.bind(this))
 					.attr('r', function (d, i) { return 3; })
-					.on('mouseover', this._mouseover.bind(this))
-					.on('mouseout', this._mouseout.bind(this));
+					.attr('style', 'cursor:pointer');
+
+				this.points[series] = this.chart.selectAll('.point')
+						.data(this.options.data[series])
+					.enter().append('circle')
+						.attr('fill', 'white')
+						.attr('opacity', 0)
+						.attr('class', 'trace-' + series)
+						.attr('cx', function (d, i) { return this.xfunc(d[0]); }.bind(this))
+						.attr('cy', function (d, i) { return this.yfunc(d[1]); }.bind(this))
+						.attr('r', function (d, i) { return 6; })
+						.attr('style', 'cursor:pointer')
+						.on('mouseover', this._mouseover.bind(this))
+						.on('mouseout', this._mouseout.bind(this));
 			}
 		}.bind(this));
 

trace/base.js

@@ -62,8 +62,8 @@ define([
 			margin: [20,20,20,20],
 			xTickCount: null,
 			yTickCount: null,
-			xTickFormat: this.emptyFunction,
-			yTickFormat: this.emptyFunction,
+			xTickFormat: null,
+			yTickFormat: null,
 			zoom: false,
 			colors: ['#e74c3c', '#e67e22', '#f1c40f', '#2ecc71', '#1abc9c', '#3498db', '#9b59b6']
 		};
@@ -174,11 +174,11 @@ define([
 			return;
 		}
 
-		if (this.tooltip) {
+		if (this.options.tooltips) {
 			this.tooltip = document.createElement('div');
 			this.tooltip.className = 'trace-tooltip';
 			this.tooltip.innerHTML = this.options.tooltips(evt);
-			this.tooltip.style.left = (d3.event.clientX + window.scrollX) + 'px';
+			this.tooltip.style.left = (d3.event.clientX + window.scrollX + 10) + 'px';
 			this.tooltip.style.top = (d3.event.clientY + window.scrollY) + 'px';
 			document.body.appendChild(this.tooltip);
 		}
@@ -269,11 +269,10 @@ define([
 		}
 
 		// render the tooltips
-		if (this.options.tooltip) {
+		if (this.options.tooltips) {
 			if (!this.options.points) {
 				throw 'Tooltips require points to be set';
 			}
-			this._tooltips();
 		}
 	};