Svg d3.js路径和工具提示问题

我是d3.js的新手，我愿意学习它，我正在做一个网站，我需要在最后打开我的路径，我想给它添加一些工具提示，我已经在网上阅读了一些文档，我的代码中没有任何意义，有人能帮我解释一下吗，提前谢谢！！：）

我的代码如下，它生成两个图形：

function getDateX(day2)
{
    day = new String(day2);
    return new Date(day.substring(0, 4) + '-' + day.substring(4, 6) + '-' + day.substring(6, 8));
}

function plotData(id, data, type)
{
    var margin = {top: 40, right: 15, bottom: 30, left: 55},
        width = 455,
        height = 270 - margin.top - margin.bottom;

    var x = d3.time.scale().range([0, width]);
    var y = d3.scale.linear().range([height, 0]);

    var xAxis = d3.svg.axis().scale(x).orient("bottom").ticks(data.length < 7 ? data.length : (data.length > 14 ? data.length / 5 : data.length / 3) ).tickFormat(d3.time.format("%d/%m"));
    var yAxis = d3.svg.axis().scale(y).orient("left").ticks(5);


    var area = d3.svg.area()    
        .x(function(d) { return x(getDateX(d.day)); })
        .y0(height)                 
        .y1(function(d) { return y( type == 'score' ? parseFloat(d.score) : d.good + d.neutral + d.bad)});


    var svg = d3.select("#" + id)
        .append("svg")
            .attr("width", width + margin.left + margin.right)
            .attr("height", height + margin.top + margin.bottom)
        .append("g")
            .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

    svg.data(data);
    x.domain(d3.extent(data, function(d) { return getDateX(d.day); }));
    var min = d3.min(data, function(d) { return parseFloat(d.score); });

    if(min > 6)
        min = 6;
    else if(min > 1)
        min--;

    if(type == 'score')
        y.domain([min, 10]);
    else
        y.domain([0, d3.max(data, function(d) { return d.good + d.neutral + d.bad; })]);

    svg.append("path").datum(data).attr("class", "area").attr("d", area);
    svg.append("g").attr("class", "x axis").attr("transform", "translate(0," + height + ")").call(xAxis);
    svg.append("g").attr("class", "y axis").call(yAxis);
}



var scores = 
[
<%
    boolean appendComma = false;
    for(MovieGrade grade : info.getGrades())
    {
        if(appendComma)
            out.print(",");
        else
            appendComma = true;
        out.print("{\"day\":" + grade.getDay() + ", \"good\":" + grade.getGood() + ", \"neutral\":" + grade.getNeutral() + ", \"bad\":" + grade.getBad() + ", \"score\":\"" + grade.getScore() + "\"}");
    }
%>
];


plotData('evolucao-score', scores, 'score');
plotData('evolucao-comments', scores, 'comments');

函数getDateX（第2天） { 天=新字符串（第2天）； 返回新日期（day.substring（0,4）+'-'+day.substring（4,6）+'-'+day.substring（6,8））； } 函数绘图数据（id、数据、类型） { var margin={顶部：40，右侧：15，底部：30，左侧：55}， 宽度=455， 高度=270-margin.top-margin.bottom； var x=d3.time.scale（）.range（[0，width]）； 变量y=d3.scale.linear（）.range（[height，0]）； var xAxis=d3.svg.axis（）.scale（x）.orient（“底部”）.ticks（data.length<7？data.length:（data.length>14？data.length/5:data.length/3））.tickFormat（d3.time.format（“%d/%m”）； var yAxis=d3.svg.axis（）.scale（y）、orient（“left”）、ticks（5）； var area=d3.svg.area（） .x（函数（d）{return x（getDateX（d.day））；}） .y0（高度） .y1（函数（d）{returny y（type='score'？parseFloat（d.score）：d.good+d.neutral+d.bad）}）； var svg=d3。选择（“#”+id） .append（“svg”） .attr（“宽度”，宽度+边距。左侧+边距。右侧） .attr（“高度”，高度+边距。顶部+边距。底部） .附加（“g”） .attr（“转换”、“平移”（+margin.left+）、“+margin.top+”）； svg.data（数据）； x、 域（d3.extent（数据，函数（d）{return getDateX（d.day）；}）； var min=d3.min（数据，函数（d）{return parseFloat（d.score）；}）； 如果（最小值>6） 最小=6； 否则，如果（最小值>1） 闵--； 如果（类型=‘分数’） y、 域（[min，10]）； 其他的 y、 域（[0，d3.max（数据，函数（d）{返回d.good+d.neutral+d.bad；}）]； svg.append（“path”）.datum（data）.attr（“class”，“area”）.attr（“d”，area）； svg.append（“g”）.attr（“class”、“x轴”）.attr（“transform”、“translate（0）”+height+））.call（xAxis）； svg.append（“g”）.attr（“class”，“y轴”）.call（yAxis）； } var分数= [ ]; plotData（“evolucao-score”，分数，“分数”）； plotData（“evolucao-comments”，分数，“comments”）；

---

您的实际问题是什么？StackOverflow最有帮助的是，当你能清楚地表达出你遇到的问题和你已经尝试过的问题时——像这样的大代码转储不太可能得到任何答案。我想让这段代码在我的SVG上生成工具提示，但我决不会做不到……为了得到好的答案：1）只包含导致问题的代码。2） 明确说明您正在尝试做什么（“添加工具提示”）。3） 通常，显示您尝试过的内容（“我尝试添加了一些工具提示，如…但我遇到了错误…”）。如果您愿意使用jQuery，还可以查看jQuery powerTip