Как изменить линейный график на график области

Question

Я пытаюсь изменить линейный график на график области, используя dc.js.Это код, который я пробовал.

var removeHighlight = function() { // when the brush is moved by user, this function is called and then highlightChart function called.
  console.log("removeHighlight");
  var panel = $(".chart-body")[0].firstChild;
  while (panel.childElementCount !== 1) {     // childElementCount == 2 -> while 진입
      panel.removeChild(panel.lastChild);
  }
};

// This function is to highlight the line chart in selected time range
// It happens when the chart has redrawn after the time brush in moved by user
var highlightChart = function() {
  console.log("highlightChart");
  var chartBody = $(".chart-body")[0];
  var extent = $(".extent")[0];
  var panel = chartBody.firstChild;
  var oldPath = panel.firstChild;
  var newPath = oldPath.cloneNode(true);

  // If user clink the "reset" button, the whole line will be highlighted, the function return.
  if (resetClink === 1 || extent.getAttribute("width") === "0") {
      resetClink += 2;
      oldPath.setAttribute("stroke", "#1f77b4");
      return;
  }

  if (panel.childElementCount !== 1) {
      removeHighlight();
  }
  var left = extent.getBoundingClientRect().left - chartBody.getBoundingClientRect().left;
  var right = chartBody.getBoundingClientRect().right - extent.getBoundingClientRect().right;

  // Dim the old line in chart by setting it to "grey color"
  oldPath.setAttribute("stroke", "#ccc");
  newPath.setAttribute("stroke", "#1f77b4");
  newPath.style.fill = "rgba(31, 119, 180, .3)";
  newPath.style.clipPath = "inset(0px " + right + "px 0px " + left + "px)";

  // Add the "blue color" highlight segment of line to the chart
  panel.appendChild(newPath);
};

timeSeries
  .width(width)
  .height(height)
  .margins({top: margin.top, right: margin.right, bottom: margin.bottom, left: margin.left})
  .renderArea(true)
  .dimension(timeDimension)
  .group(timeGroup)
  .x(d3.time.scale().domain([minDate, maxDate]))
  .xUnits(d3.time.days)
  .xAxisLabel(startDate + "   to   " + endDate)
  .elasticY(true)
  .on("postRedraw", highlightChart)
  .on("filtered", removeHighlight)

dc.renderAll();
timeSeries.filter([minDate, maxDate]);

Я пытался залить цвет под обводкой, как newPath.style.fill = "rgba (31, 119, 180, .3)";Но он показывает как введите описание изображения здесь

Как я могу это исправить?