title: Remove line from line graph in d3.js
body: <p>I have a button that displays a line graph using d3.js. But I want to remove the line from the graph on clicking the same button. I have created a toggle button, but how do i remove the line from the graph ? I have the following function that plots the graph. svg.selectAll("path").remove() is removing the axis and but not the line.</p>
  
  <p>function plotGraph(file) {</p>
  
  <pre><code>var color = d3.scale.category10();
  var svg = d3.select('#mySvg');
  
  svg.selectAll("path").remove();
  
  var line = d3.svg.line().interpolate("basis").x(function(d) {
      return x(d.date);
  }).y(function(d) {
      return y(d.mvalue);
  });
  
  d3.csv(file,function(error, data) {
  
      color.domain(d3.keys(data[0]).filter(function(key) {
          return key !== "date";
      }));
  
      data = data.map(function(d) {
      return {
          mvalue : +d.mvalue,
          date : parseDate(d.date)
      };
      });
  
      x.domain(d3.extent(data, function(d) {
          return d.date;
      }));
      y.domain([ 0, 100 ]);
      svg.append("path").datum(data).attr("class", "line").attr("d",line);
  
  });
  </code></pre>
  
  <p>}</p>