Fix/scatter tooltip mode (#8354)

* scatter tooltip should be point by default
* edited mode on better level and updated docs to be bit more clear

diff --git a/docs/docs/charts/line.mdx b/docs/docs/charts/line.mdx
index 3c58ae9d22a8ee3eecc272938e15729a1cc4a05a..c6856e3cc2df9f239ec0ee7aa9dee31348b505ab 100644 (file)
--- a/docs/docs/charts/line.mdx
+++ b/docs/docs/charts/line.mdx
@@ -87,7 +87,7 @@ The line chart allows a number of properties to be specified for each dataset. T
 | [`pointRadius`](#point-styling) | `number` | Yes | Yes | `3`
 | [`pointRotation`](#point-styling) | `number` | Yes | Yes | `0`
 | [`pointStyle`](#point-styling) | `string`\|`Image` | Yes | Yes | `'circle'`
-| [`showLine`](#line-styling) | `boolean` | - | - | `undefined`
+| [`showLine`](#line-styling) | `boolean` | - | - | `true`
 | [`spanGaps`](#line-styling) | `boolean`\|`number` | - | - | `undefined`
 | [`stepped`](#stepped) | `boolean`\|`string` | - | - | `false`
 | [`xAxisID`](#general) | `string` | - | - | first x axis

diff --git a/docs/docs/charts/scatter.mdx b/docs/docs/charts/scatter.mdx
index 1df75c20d6f04bf243399df72d34396eedfb3998..c23ed91f99033c5ccad015db8f082072dcbd6124 100644 (file)
--- a/docs/docs/charts/scatter.mdx
+++ b/docs/docs/charts/scatter.mdx
@@ -50,6 +50,7 @@ function example() {
 ## Dataset Properties
 
 The scatter chart supports all of the same properties as the [line chart](./charts/line.mdx#dataset-properties).
+By default, the scatter chart will override the showLine property of the line chart to `false`.
 
 ## Data Structure
 

diff --git a/src/controllers/controller.scatter.js b/src/controllers/controller.scatter.js
index 1bf2fd5d693ab4c53c8fefaa68a777d1f02eff6c..e13bf50c1a4e5273ac8aea5c4f4dc0a01a3ef604 100644 (file)
--- a/src/controllers/controller.scatter.js
+++ b/src/controllers/controller.scatter.js
@@ -24,6 +24,10 @@ ScatterController.defaults = {
                fill: false
        },
 
+       interaction: {
+               mode: 'point'
+       },
+
        plugins: {
                tooltip: {
                        callbacks: {

diff --git a/test/specs/controller.scatter.tests.js b/test/specs/controller.scatter.tests.js
index df51683615920bc7b9cd36b02b9307f848b1619e..b181c91c5ee069f5cdc538db1d7789c7452825fd 100644 (file)
--- a/test/specs/controller.scatter.tests.js
+++ b/test/specs/controller.scatter.tests.js
@@ -31,4 +31,44 @@ describe('Chart.controllers.scatter', function() {
 
                jasmine.triggerMouseEvent(chart, 'mousemove', point);
        });
+
+       it('should only show a single point in the tooltip on multiple datasets', function(done) {
+               var chart = window.acquireChart({
+                       type: 'scatter',
+                       data: {
+                               datasets: [{
+                                       data: [{
+                                               x: 10,
+                                               y: 15
+                                       },
+                                       {
+                                               x: 12,
+                                               y: 10
+                                       }],
+                                       label: 'dataset1'
+                               },
+                               {
+                                       data: [{
+                                               x: 20,
+                                               y: 10
+                                       },
+                                       {
+                                               x: 4,
+                                               y: 8
+                                       }],
+                                       label: 'dataset2'
+                               }]
+                       },
+                       options: {}
+               });
+               var point = chart.getDatasetMeta(0).data[1];
+
+               afterEvent(chart, 'mousemove', function() {
+                       expect(chart.tooltip.body.length).toEqual(1);
+
+                       done();
+               });
+
+               jasmine.triggerMouseEvent(chart, 'mousemove', point);
+       });
 });