Moves bar and arc opacity styling to CSS; closes #1069. (#2069)

c3js · Jul 20, 2017 · aea27e0 · aea27e0
1 parent 39caf93
commit aea27e0
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 7 deletions.
diff --git a/src/arc.js b/src/arc.js
@@ -191,8 +191,7 @@ c3_chart_internal_fn.unexpandArc = function (targetIds) {
  return $$.expandDuration(d.data.id);
  })
  .attr("d", $$.svgArc);
- $$.svg.selectAll('.' + CLASS.arc)
- .style("opacity", 1);
+ $$.svg.selectAll('.' + CLASS.arc);
 };
 
 c3_chart_internal_fn.expandDuration = function (id) {
@@ -297,7 +296,6 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
  .attr("class", $$.classArc.bind($$))
  .style("fill", function (d) { return $$.color(d.data); })
  .style("cursor", function (d) { return config.interaction_enabled && config.data_selection_isselectable(d) ? "pointer" : null; })
- .style("opacity", 0)
  .each(function (d) {
  if ($$.isGaugeType(d.data)) {
  d.startAngle = d.endAngle = config.gauge_startingAngle;
@@ -306,7 +304,6 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
  });
  mainArc
  .attr("transform", function (d) { return !$$.isGaugeType(d.data) && withTransform ? "scale(0)" : ""; })
- .style("opacity", function (d) { return d === this._current ? 0 : 1; })
  .on('mouseover', config.interaction_enabled ? function (d) {
  var updated, arcData;
  if ($$.transiting) { // skip while transiting
@@ -387,7 +384,6 @@ c3_chart_internal_fn.redrawArc = function (duration, durationForExit, withTransf
  .style("fill", function (d) {
  return $$.levelColor ? $$.levelColor(d.data.values[0].value) : $$.color(d.data.id);
  }) // Where gauge reading color would receive customization.
- .style("opacity", 1)
  .call($$.endall, function () {
  $$.transiting = false;
  });

diff --git a/src/scss/arc.scss b/src/scss/arc.scss
@@ -22,3 +22,11 @@
  fill: #000;
 /* font-size: 28px !important;*/
 }
+
+.c3-chart-arc.c3-target g path {
+ opacity: 1;
+}
+
+.c3-chart-arc.c3-target.c3-focused g path {
+ opacity: 1;
+}
diff --git a/src/scss/bar.scss b/src/scss/bar.scss
@@ -2,5 +2,6 @@
  stroke-width: 0;
 }
 .c3-bar._expanded_ {
+ fill-opacity: 1;
  fill-opacity: 0.75;
 }
diff --git a/src/shape.bar.js b/src/shape.bar.js
@@ -18,7 +18,6 @@ c3_chart_internal_fn.updateTargetsForBar = function (targets) {
  .attr('class', function (d) { return classChartBar(d) + classFocus(d); });
  mainBarEnter = mainBarUpdate.enter().append('g')
  .attr('class', classChartBar)
- .style('opacity', 0)
  .style("pointer-events", "none");
  // Bars for each data
  mainBarEnter.append('g')
@@ -41,7 +40,6 @@ c3_chart_internal_fn.updateBar = function (durationForExit) {
  $$.mainBar
  .style("opacity", initialOpacity);
  $$.mainBar.exit().transition().duration(durationForExit)
- .style('opacity', 0)
  .remove();
 };
 c3_chart_internal_fn.redrawBar = function (drawBar, withTransition) {