Использование общей функции для линии рисования d3js

Question

Я использую d3js для рисования многострочной диаграммы.

Моя функция для рисования линии ниже.

meanLine = d3.svg.line() 
      .interpolate('linear') 
      .x(function (d) { 
       return xScale(d.date); 
      }) 
      .y(function (d) { 
       return yScale(d.mean); 
      }); 

//data is declared at top 
group.append('svg:path') 
      .attr({ 
       d: meanLine(data), 
       "stroke": "rgba(" + color + ", 0.8)", 
      }); 

Здесь значение даты и среднего значения жестко запрограммировано. Мне нужна общая функция, которой я могу передать, какое значение использовать для рисования линии.

Я хочу что-то вроде

lineFunc = d3.svg.line() 
      .interpolate('linear') 
      .x(function (d, xval) { 
       return xScale(d[xval]); 
      }) 
      .y(function (d, yval) { 
       return yScale(d[yval]); 
      }); 

//data is declared at top 
group.append('svg:path') 
      .attr({ 
       d: lineFunc(data, xval, yval), 
       "stroke": "rgba(" + color + ", 0.8)", 
      }); 

Answer 1

Вы можете сделать что-то вроде этого ... здесь myLineFun дома ваш d3 line function:

//make a function which houses the line function 
var myLineFun = function(data, xval, yval){ 
     //the line function 
     var lineFunc = d3.svg.line() 
      .interpolate('linear') 
      .x(function (d) { 
       return xScale(d[xval]);//xval passed in the argument 
      }) 
      .y(function (d) { 
       return yScale(d[yval]);//yval passed in the argument 
      }); 
     return lineFunc(data);//this will return the d attribute 
} 

А потом называют это:

group.append('svg:path') 
      .attr({ 
       d: myLineFun(data, xval, yval), 
       "stroke": "rgba(" + color + ", 0.8)", 
      }); 

Надежда это помогает!