Commit 0ecfeaca authored by Masayuki Tanaka's avatar Masayuki Tanaka

Refactor subchart - #890

parent 4f35d8f5
...@@ -399,7 +399,7 @@ ...@@ -399,7 +399,7 @@
}; };
c3_chart_internal_fn.updateTargets = function (targets) { c3_chart_internal_fn.updateTargets = function (targets) {
var $$ = this, config = $$.config; var $$ = this;
/*-- Main --*/ /*-- Main --*/
...@@ -419,11 +419,13 @@ ...@@ -419,11 +419,13 @@
if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); } if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
/*-- Show --*/
// Fade-in each chart // Fade-in each chart
$$.showTargets();
};
c3_chart_internal_fn.showTargets = function () {
var $$ = this;
$$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); }) $$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); })
.transition().duration(config.transition_duration) .transition().duration($$.config.transition_duration)
.style("opacity", 1); .style("opacity", 1);
}; };
...@@ -5178,9 +5180,7 @@ ...@@ -5178,9 +5180,7 @@
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context')); context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context'));
if (!config.subchart_show) { context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
context.style('visibility', 'hidden');
}
// Define g for chart area // Define g for chart area
context.append('g') context.append('g')
...@@ -5199,9 +5199,7 @@ ...@@ -5199,9 +5199,7 @@
context.append("g") context.append("g")
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr("class", CLASS.brush) .attr("class", CLASS.brush)
.call($$.brush) .call($$.brush);
.selectAll("rect")
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
// ATTENTION: This must be called AFTER chart added // ATTENTION: This must be called AFTER chart added
// Add Axis // Add Axis
...@@ -5220,6 +5218,7 @@ ...@@ -5220,6 +5218,7 @@
classAreas = $$.classAreas.bind($$); classAreas = $$.classAreas.bind($$);
if (config.subchart_show) { if (config.subchart_show) {
//-- Bar --//
contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar) contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
.data(targets) .data(targets)
.attr('class', classChartBar); .attr('class', classChartBar);
...@@ -5243,6 +5242,10 @@ ...@@ -5243,6 +5242,10 @@
// Area // Area
contextLineEnter.append("g") contextLineEnter.append("g")
.attr("class", classAreas); .attr("class", classAreas);
//-- Brush --//
context.selectAll('.' + CLASS.brush + ' rect')
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
} }
}; };
c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) { c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) {
...@@ -5306,6 +5309,8 @@ ...@@ -5306,6 +5309,8 @@
var $$ = this, d3 = $$.d3, config = $$.config, var $$ = this, d3 = $$.d3, config = $$.config,
drawAreaOnSub, drawBarOnSub, drawLineOnSub; drawAreaOnSub, drawBarOnSub, drawLineOnSub;
$$.context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
// subchart // subchart
if (config.subchart_show) { if (config.subchart_show) {
// reflect main chart to extent on subchart if zoomed // reflect main chart to extent on subchart if zoomed
......
This source diff could not be displayed because it is too large. You can view the blob instead.
...@@ -394,7 +394,7 @@ c3_chart_internal_fn.updateSizes = function () { ...@@ -394,7 +394,7 @@ c3_chart_internal_fn.updateSizes = function () {
}; };
c3_chart_internal_fn.updateTargets = function (targets) { c3_chart_internal_fn.updateTargets = function (targets) {
var $$ = this, config = $$.config; var $$ = this;
/*-- Main --*/ /*-- Main --*/
...@@ -414,11 +414,13 @@ c3_chart_internal_fn.updateTargets = function (targets) { ...@@ -414,11 +414,13 @@ c3_chart_internal_fn.updateTargets = function (targets) {
if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); } if ($$.updateTargetsForSubchart) { $$.updateTargetsForSubchart(targets); }
/*-- Show --*/
// Fade-in each chart // Fade-in each chart
$$.showTargets();
};
c3_chart_internal_fn.showTargets = function () {
var $$ = this;
$$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); }) $$.svg.selectAll('.' + CLASS.target).filter(function (d) { return $$.isTargetToShow(d.id); })
.transition().duration(config.transition_duration) .transition().duration($$.config.transition_duration)
.style("opacity", 1); .style("opacity", 1);
}; };
......
...@@ -13,9 +13,7 @@ c3_chart_internal_fn.initSubchart = function () { ...@@ -13,9 +13,7 @@ c3_chart_internal_fn.initSubchart = function () {
var $$ = this, config = $$.config, var $$ = this, config = $$.config,
context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context')); context = $$.context = $$.svg.append("g").attr("transform", $$.getTranslate('context'));
if (!config.subchart_show) { context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
context.style('visibility', 'hidden');
}
// Define g for chart area // Define g for chart area
context.append('g') context.append('g')
...@@ -34,9 +32,7 @@ c3_chart_internal_fn.initSubchart = function () { ...@@ -34,9 +32,7 @@ c3_chart_internal_fn.initSubchart = function () {
context.append("g") context.append("g")
.attr("clip-path", $$.clipPath) .attr("clip-path", $$.clipPath)
.attr("class", CLASS.brush) .attr("class", CLASS.brush)
.call($$.brush) .call($$.brush);
.selectAll("rect")
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
// ATTENTION: This must be called AFTER chart added // ATTENTION: This must be called AFTER chart added
// Add Axis // Add Axis
...@@ -55,6 +51,7 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) { ...@@ -55,6 +51,7 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
classAreas = $$.classAreas.bind($$); classAreas = $$.classAreas.bind($$);
if (config.subchart_show) { if (config.subchart_show) {
//-- Bar --//
contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar) contextBarUpdate = context.select('.' + CLASS.chartBars).selectAll('.' + CLASS.chartBar)
.data(targets) .data(targets)
.attr('class', classChartBar); .attr('class', classChartBar);
...@@ -78,6 +75,10 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) { ...@@ -78,6 +75,10 @@ c3_chart_internal_fn.updateTargetsForSubchart = function (targets) {
// Area // Area
contextLineEnter.append("g") contextLineEnter.append("g")
.attr("class", classAreas); .attr("class", classAreas);
//-- Brush --//
context.selectAll('.' + CLASS.brush + ' rect')
.attr(config.axis_rotated ? "width" : "height", config.axis_rotated ? $$.width2 : $$.height2);
} }
}; };
c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) { c3_chart_internal_fn.updateBarForSubchart = function (durationForExit) {
...@@ -141,6 +142,8 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat ...@@ -141,6 +142,8 @@ c3_chart_internal_fn.redrawSubchart = function (withSubchart, transitions, durat
var $$ = this, d3 = $$.d3, config = $$.config, var $$ = this, d3 = $$.d3, config = $$.config,
drawAreaOnSub, drawBarOnSub, drawLineOnSub; drawAreaOnSub, drawBarOnSub, drawLineOnSub;
$$.context.style('visibility', config.subchart_show ? 'visible' : 'hidden');
// subchart // subchart
if (config.subchart_show) { if (config.subchart_show) {
// reflect main chart to extent on subchart if zoomed // reflect main chart to extent on subchart if zoomed
......
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