add 'noCrisp' option to Axes.drawTicks and Axes.drawGrid

... to turn off crispEdge SVG rendering.

Author: etpinard

src/plots/cartesian/axes.js

@@ -1805,7 +1805,7 @@ axes.drawTicks = function(gd, ax, opts) {
     ticks.enter().append('path')
         .classed(cls, 1)
         .classed('ticks', 1)
-        .classed('crisp', 1)
+        .classed('crisp', !opts.noCrisp)
         .call(Color.stroke, ax.tickcolor)
         .style('stroke-width', Drawing.crispRound(gd, ax.tickwidth, 1) + 'px')
         .attr('d', opts.path);
@@ -1825,7 +1825,7 @@ axes.drawGrid = function(gd, ax, opts) {
 
     grid.enter().append('path')
         .classed(cls, 1)
-        .classed('crisp', 1)
+        .classed('crisp', !opts.noCrisp)
         .attr('d', opts.path)
         .each(function(d) {
             if(ax.zeroline && (ax.type === 'linear' || ax.type === '-') &&
@@ -1857,7 +1857,7 @@ axes.drawZeroLine = function(gd, ax, opts) {
     zl.enter().append('path')
         .classed(cls, 1)
         .classed('zl', 1)
-        .classed('crisp', 1)
+        .classed('crisp', !opts.noCrisp)
         .attr('d', opts.path)
         .each(function() {
             // use the fact that only one element can enter to trigger a sort.

src/plots/polar/polar.js

@@ -296,10 +296,6 @@ proto.updateLayout = function(fullLayout, polarLayout) {
         .attr('d', dPath)
         .attr('transform', strTranslate(cx, cy))
         .call(Color.fill, polarLayout.bgcolor);
-
-    // remove crispEdges - all the off-square angles in polar plots
-    // make these counterproductive.
-    _this.framework.selectAll('.crisp').classed('crisp', 0);
 };
 
 proto.mockAxis = function(fullLayout, polarLayout, axLayout, opts) {
@@ -420,14 +416,16 @@ proto.updateRadialAxis = function(fullLayout, polarLayout) {
             vals: vals,
             layer: layers['radial-axis'],
             path: Axes.makeTickPath(ax, 0, tickSign[2]),
-            transFn: transFn
+            transFn: transFn,
+            noCrisp: true
         });
 
         Axes.drawGrid(gd, ax, {
             vals: valsClipped,
             layer: layers['radial-grid'],
             path: gridPathFn,
-            transFn: Lib.noop
+            transFn: Lib.noop,
+            noCrisp: true
         });
 
         Axes.drawLabels(gd, ax, {
@@ -638,14 +636,16 @@ proto.updateAngularAxis = function(fullLayout, polarLayout) {
             vals: vals,
             layer: layers['angular-axis'],
             path: 'M' + (tickSign[2] * pad) + ',0h' + (tickSign[2] * ax.ticklen),
-            transFn: transFn2
+            transFn: transFn2,
+            noCrisp: true
         });
 
         Axes.drawGrid(gd, ax, {
             vals: vals,
             layer: layers['angular-grid'],
             path: gridPathFn,
-            transFn: Lib.noop
+            transFn: Lib.noop,
+            noCrisp: true
         });
 
         Axes.drawLabels(gd, ax, {

src/plots/ternary/ternary.js

@@ -323,10 +323,6 @@ proto.adjustLayout = function(ternaryLayout, graphSize) {
 
     _this.drawAxes(true);
 
-    // remove crispEdges - all the off-square angles in ternary plots
-    // make these counterproductive.
-    _this.plotContainer.selectAll('.crisp').classed('crisp', false);
-
     _this.layers.aline.select('path')
         .attr('d', aaxis.showline ?
             'M' + x0 + ',' + (y0 + h) + 'l' + (w / 2) + ',-' + h : 'M0,0')
@@ -454,14 +450,16 @@ proto.drawAx = function(ax) {
         vals: ax.ticks === 'inside' ? valsClipped : vals,
         layer: axLayer,
         path: tickPath,
-        transFn: transFn
+        transFn: transFn,
+        noCrisp: true
     });
 
     Axes.drawGrid(gd, ax, {
         vals: valsClipped,
         layer: _this.layers[axLetter + 'grid'],
         path: gridPath,
-        transFn: transFn
+        transFn: transFn,
+        noCrisp: true
     });
 
     var labelFns = Axes.makeLabelFns(ax, 0, counterAngle);
@@ -731,7 +729,6 @@ proto.initInteractions = function() {
         _this.caxis.range = [_this.sum - mins.a - mins.b, mins.c];
 
         _this.drawAxes(false);
-        _this.plotContainer.selectAll('.crisp').classed('crisp', false);
 
         if(_this._hasClipOnAxisFalse) {
             _this.plotContainer