Skip to content

C
c3-closed
Commit 6cf97b72 authored by Masayuki Tanaka's avatar Masayuki Tanaka
Browse files
Options

Fix legend state when reverted

parent c6e719ac
Hide whitespace changes
Inline Side-by-side
Showing with 26 additions and 24 deletions
c3.js
View file @ 6cf97b72
...@@ -3873,7 +3873,6 @@ ...@@ -3873,7 +3873,6 @@
var paddingTop = 4, paddingRight = 10, maxWidth = 0, maxHeight = 0, posMin = 10, tileWidth = 15; var paddingTop = 4, paddingRight = 10, maxWidth = 0, maxHeight = 0, posMin = 10, tileWidth = 15;
var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0; var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0;
var withTransition, withTransitionForTransform; var withTransition, withTransitionForTransform;
var hasFocused = $$.legend.selectAll('.' + CLASS.legendItemFocused).size();
var texts, rects, tiles, background; var texts, rects, tiles, background;
options = options || {}; options = options || {};
...@@ -4063,16 +4062,7 @@ ...@@ -4063,16 +4062,7 @@
// toggle legend state // toggle legend state
$$.legend.selectAll('.' + CLASS.legendItem) $$.legend.selectAll('.' + CLASS.legendItem)
.classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); }) .classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); });
.transition()
.style('opacity', function (id) {
var This = $$.d3.select(this);
if ($$.isTargetToShow(id)) {
return !hasFocused || This.classed(CLASS.legendItemFocused) ? $$.opacityForLegend(This) : $$.opacityForUnfocusedLegend(This);
} else {
return null; // c3-legend-item-hidden will be applied
}
});
// Update all to reflect change of legend // Update all to reflect change of legend
$$.updateLegendItemWidth(maxWidth); $$.updateLegendItemWidth(maxWidth);
...@@ -5809,7 +5799,6 @@ ...@@ -5809,7 +5799,6 @@
targetIds = $$.mapToTargetIds(targetIds); targetIds = $$.mapToTargetIds(targetIds);
candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))), candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))),
this.revert();
candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true); candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true);
if ($$.hasArcType()) { if ($$.hasArcType()) {
$$.unexpandArc(targetIds); $$.unexpandArc(targetIds);
...@@ -5834,6 +5823,11 @@ ...@@ -5834,6 +5823,11 @@
} }
if ($$.config.legend_show) { if ($$.config.legend_show) {
$$.showLegend(targetIds.filter($$.isLegendToShow.bind($$))); $$.showLegend(targetIds.filter($$.isLegendToShow.bind($$)));
$$.legend.selectAll($$.selectorLegends(targetIds))
.filter(function () {
return $$.d3.select(this).classed(CLASS.legendItemFocused);
})
.classed(CLASS.legendItemFocused, false);
} }
$$.focusedTargetIds = []; $$.focusedTargetIds = [];
......
c3.min.js
View file @ 6cf97b72
This source diff could not be displayed because it is too large. You can view the blob instead.
spec/api.focus-spec.js
View file @ 6cf97b72
...@@ -219,6 +219,7 @@ describe('c3 api focus', function () { ...@@ -219,6 +219,7 @@ describe('c3 api focus', function () {
}); });
legendItems.each(function () { legendItems.each(function () {
var item = d3.select(this); var item = d3.select(this);
expect(item.classed('c3-legend-item-focused')).toBeFalsy();
expect(+item.style('opacity')).toBeCloseTo(1); expect(+item.style('opacity')).toBeCloseTo(1);
}); });
done(); done();
...@@ -241,6 +242,7 @@ describe('c3 api focus', function () { ...@@ -241,6 +242,7 @@ describe('c3 api focus', function () {
}); });
legendItems.each(function () { legendItems.each(function () {
var item = d3.select(this); var item = d3.select(this);
expect(item.classed('c3-legend-item-focused')).toBeFalsy();
expect(+item.style('opacity')).toBeCloseTo(1); expect(+item.style('opacity')).toBeCloseTo(1);
}); });
done(); done();
...@@ -271,6 +273,9 @@ describe('c3 api focus', function () { ...@@ -271,6 +273,9 @@ describe('c3 api focus', function () {
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1); expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1); expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1); expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeTruthy();
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeTruthy();
done(); done();
}, 1000); }, 1000);
}, 1000); }, 1000);
...@@ -299,6 +304,9 @@ describe('c3 api focus', function () { ...@@ -299,6 +304,9 @@ describe('c3 api focus', function () {
expect(+legendItems.data1.style('opacity')).toBeCloseTo(0.3); expect(+legendItems.data1.style('opacity')).toBeCloseTo(0.3);
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1); expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3); expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3);
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
done(); done();
}, 1000); }, 1000);
}, 1000); }, 1000);
...@@ -327,6 +335,9 @@ describe('c3 api focus', function () { ...@@ -327,6 +335,9 @@ describe('c3 api focus', function () {
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1); expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1); expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data3.style('opacity')).toBeCloseTo(1); expect(+legendItems.data3.style('opacity')).toBeCloseTo(1);
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeTruthy();
done(); done();
}, 1000); }, 1000);
}, 1000); }, 1000);
...@@ -355,6 +366,9 @@ describe('c3 api focus', function () { ...@@ -355,6 +366,9 @@ describe('c3 api focus', function () {
expect(+legendItems.data1.style('opacity')).toBeCloseTo(1); expect(+legendItems.data1.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data2.style('opacity')).toBeCloseTo(1); expect(+legendItems.data2.style('opacity')).toBeCloseTo(1);
expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3); expect(+legendItems.data3.style('opacity')).toBeCloseTo(0.3);
expect(legendItems.data1.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data2.classed('c3-legend-item-focused')).toBeFalsy();
expect(legendItems.data3.classed('c3-legend-item-focused')).toBeFalsy();
done(); done();
}, 1000); }, 1000);
}, 1000); }, 1000);
......
src/api.focus.js
View file @ 6cf97b72
...@@ -24,7 +24,6 @@ c3_chart_fn.defocus = function (targetIds) { ...@@ -24,7 +24,6 @@ c3_chart_fn.defocus = function (targetIds) {
targetIds = $$.mapToTargetIds(targetIds); targetIds = $$.mapToTargetIds(targetIds);
candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))), candidates = $$.svg.selectAll($$.selectorTargets(targetIds.filter($$.isTargetToShow, $$))),
this.revert();
candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true); candidates.classed(CLASS.focused, false).classed(CLASS.defocused, true);
if ($$.hasArcType()) { if ($$.hasArcType()) {
$$.unexpandArc(targetIds); $$.unexpandArc(targetIds);
...@@ -49,6 +48,11 @@ c3_chart_fn.revert = function (targetIds) { ...@@ -49,6 +48,11 @@ c3_chart_fn.revert = function (targetIds) {
} }
if ($$.config.legend_show) { if ($$.config.legend_show) {
$$.showLegend(targetIds.filter($$.isLegendToShow.bind($$))); $$.showLegend(targetIds.filter($$.isLegendToShow.bind($$)));
$$.legend.selectAll($$.selectorLegends(targetIds))
.filter(function () {
return $$.d3.select(this).classed(CLASS.legendItemFocused);
})
.classed(CLASS.legendItemFocused, false);
} }
$$.focusedTargetIds = []; $$.focusedTargetIds = [];
......
src/legend.js
View file @ 6cf97b72
...@@ -117,7 +117,6 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) { ...@@ -117,7 +117,6 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
var paddingTop = 4, paddingRight = 10, maxWidth = 0, maxHeight = 0, posMin = 10, tileWidth = 15; var paddingTop = 4, paddingRight = 10, maxWidth = 0, maxHeight = 0, posMin = 10, tileWidth = 15;
var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0; var l, totalLength = 0, offsets = {}, widths = {}, heights = {}, margins = [0], steps = {}, step = 0;
var withTransition, withTransitionForTransform; var withTransition, withTransitionForTransform;
var hasFocused = $$.legend.selectAll('.' + CLASS.legendItemFocused).size();
var texts, rects, tiles, background; var texts, rects, tiles, background;
options = options || {}; options = options || {};
...@@ -307,16 +306,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) { ...@@ -307,16 +306,7 @@ c3_chart_internal_fn.updateLegend = function (targetIds, options, transitions) {
// toggle legend state // toggle legend state
$$.legend.selectAll('.' + CLASS.legendItem) $$.legend.selectAll('.' + CLASS.legendItem)
.classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); }) .classed(CLASS.legendItemHidden, function (id) { return !$$.isTargetToShow(id); });
.transition()
.style('opacity', function (id) {
var This = $$.d3.select(this);
if ($$.isTargetToShow(id)) {
return !hasFocused || This.classed(CLASS.legendItemFocused) ? $$.opacityForLegend(This) : $$.opacityForUnfocusedLegend(This);
} else {
return null; // c3-legend-item-hidden will be applied
}
});
// Update all to reflect change of legend // Update all to reflect change of legend
$$.updateLegendItemWidth(maxWidth); $$.updateLegendItemWidth(maxWidth);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment