score:2

As suggested in the comments and on the working jsfiddle, explicitly set tick and path characteristics before generating the canvas:

<div id="chart"></div>
<button id="save">Save</button>
<h1>Canvas:</h1>
<canvas id="svg-canvas"></canvas>
<script>

...

$('#save').click(myFunction);

function myFunction() {
  d3.selectAll("path").attr("fill", "none");
  d3.selectAll(".tick line, path.domain").attr("stroke", "black");
    var $container = $('#chart'),
    // Canvg requires trimmed content
    content = $container.html().trim(),
    canvas = document.getElementById('svg-canvas');

    // Draw svg on canvas
    canvg(canvas, content);
}
</script>

See: http://jsfiddle.net/vcz468f9/5/


Related Query