Dim elements outside of Tooltip.

TargetProcess · Mar 28, 2017 · 5668c01 · 5668c01
1 parent b3c9005
commit 5668c01
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 3 deletions.
diff --git a/less/tauCharts.less b/less/tauCharts.less
@@ -269,6 +269,7 @@
     }
     /*  Bar  */
     &__bar {
+        opacity: 0.7;
         shape-rendering: geometricPrecision;
         stroke-opacity: 0.5;
         stroke-width: 1;

diff --git a/plugins/tooltip.js b/plugins/tooltip.js
@@ -184,6 +184,7 @@
                         window.addEventListener('click', this._outerClickHandler, true);
                         tooltipNode.classList.add('stuck');
                         this._setTargetEventsEnabled(false);
+                        this._accentFocus(state.highlight.data);
                         this._tooltip.updateSize();
                     } else {
                         window.removeEventListener('click', this._outerClickHandler, true);
@@ -323,6 +324,18 @@
                 return meta.label;
             },
 
+            _accentFocus: function (data) {
+                var filter = function (d) {
+                    return (d === data);
+                };
+                this._chart
+                    .select(function () {
+                        return true;
+                    }).forEach(function (unit) {
+                        unit.fire('highlight', filter);
+                    });
+            },
+
             _removeFocus: function () {
                 var filter = function () {
                     return null;

diff --git a/src/elements/element.interval.js b/src/elements/element.interval.js
@@ -120,7 +120,6 @@ const Interval = {
         const createFilter = ((data, falsy) => ((row) => row === data ? true : falsy));
         node.on('highlight', (sender, filter) => this.highlight(filter));
         node.on('data-hover', ((sender, e) => this.highlight(createFilter(e.data, null))));
-        node.on('data-click', ((sender, e) => this.highlight(createFilter(e.data, e.data ? false : null))));
     },
 
     draw() {

diff --git a/src/elements/element.path.base.js b/src/elements/element.path.base.js
@@ -150,7 +150,6 @@ const BasePath = {
         node.on('highlight-data-points', (sender, filter) => this.highlightDataPoints(filter));
         if (config.guide.showAnchors !== 'never') {
             node.on('data-hover', ((sender, e) => this.highlightDataPoints(createFilter(e.data, null))));
-            node.on('data-click', ((sender, e) => this.highlight(createFilter(e.data, e.data ? false : null))));
         }
     },
 

diff --git a/src/elements/element.point.js b/src/elements/element.point.js
@@ -102,7 +102,6 @@ const Point = {
         const createFilter = ((data, falsy) => ((row) => row === data ? true : falsy));
         node.on('highlight', (sender, filter) => this.highlight(filter));
         node.on('data-hover', ((sender, e) => this.highlight(createFilter(e.data, null))));
-        node.on('data-click', ((sender, e) => this.highlight(createFilter(e.data, e.data ? false : null))));
     },
 
     draw() {