diff --git a/samples/scatter.html b/samples/scatter.html index ecc259f2f..84cfb2a0e 100644 --- a/samples/scatter.html +++ b/samples/scatter.html @@ -88,7 +88,7 @@ var ctx = document.getElementById("canvas").getContext("2d"); window.myScatter = new Chart(ctx).Scatter(scatterChartData, { responsive: true, - hoverMode: 'single', + hoverMode: 'single', // should always use single for a scatter chart scales: { xAxes: [{ gridLines: { diff --git a/src/Chart.Scatter.js b/src/Chart.Scatter.js index d1c2cf10b..1de1b06b9 100644 --- a/src/Chart.Scatter.js +++ b/src/Chart.Scatter.js @@ -6,7 +6,7 @@ helpers = Chart.helpers; var defaultConfig = { - + hoverMode: 'single', scales: { xAxes: [{ scaleType: "linear", // scatter should not use a dataset axis @@ -94,6 +94,9 @@ //String - A legend template legendTemplate: "", + tooltipTemplate: "(<%= dataX %>, <%= dataY %>)", + multiTooltipTemplate: "<%if (datasetLabel){%><%=datasetLabel%>: <%}%>(<%= dataX %>, <%= dataY %>)", + }; @@ -334,8 +337,10 @@ helpers.extend(point, { x: xScale.getPixelForValue(this.data.datasets[datasetIndex].data[index].x), y: yScale.getPixelForValue(this.data.datasets[datasetIndex].data[index].y), - value: this.data.datasets[datasetIndex].data[index].y, - label: this.data.datasets[datasetIndex].data[index].x, + dataX: this.data.datasets[datasetIndex].data[index].x, + dataY: this.data.datasets[datasetIndex].data[index].y, + label: '', // so that the multitooltip looks ok + value: this.data.datasets[datasetIndex].data[index].y, // for legacy reasons datasetLabel: this.data.datasets[datasetIndex].label, // Appearance hoverBackgroundColor: this.data.datasets[datasetIndex].pointHoverBackgroundColor || this.options.pointHoverBackgroundColor,