привет, это может быть очень легко для вас, ребята, мне просто нужно нарисовать вертикальную линию, которая представляет текущую дату в моей диаграмме gantt d3. Я уже вычисляю значения для моего yi, просто испытывая проблемы с значением в моем X, потому что im использует time.scale по оси x. плохо вставьте коды, которые рисуют мою диаграмму Ганта, и часть, где я рисую свою вертикальную линию, расположена на самом дне
initTimeDomain(tasks); initAxis(); var numFormat = d3.format(",.0f"); var dateFormat = d3.time.format("%Y-%b-%d"); var parseDate = d3.time.format("%Y-%b-%d").parse; var svg = d3.select("#gantt_chart") .append("svg") .attr("class", "chart") .attr("width", width + margin.left + margin.right) .attr("height", height + margin.top + margin.bottom) .append("g") .attr("class", "gantt-chart") .attr("width", width + margin.left + margin.right) .attr("height", (height + margin.top + margin.bottom) / tasks[tasks.length - 1].endDate) .attr("transform", "translate(" + margin.left + ", " + margin.top + ")"); //this is the x-axis svg.append("g") .attr("class", "x axis") .attr("transform", "translate(0, " + (height - margin.top - margin.bottom) + ")") .transition() .call(xAxis) .selectAll("text") .style("text-anchor","end") //.attr("dx", 35) //.attr("dy", 5); .attr("dx", "-.8em") .attr("dy", -10) .attr("transform", function(d){return "rotate(-90)"}); //this is the y-axis svg.append("g").attr("class", "y axis").transition().call(yAxis); //this is the actual gantt svg.selectAll(".chart") .data(tasks, keyFunction).enter() .append("rect") .attr("rx", 0) .attr("ry", 0) .attr("class", function(d){ if(d.status > 70) { return "bar-failed"; } else if (d.status >= 51 && d.status <= 70){ return "bar-killed"; } else{ return "bar-running"; } }) .attr("y", 0) .attr("transform", rectTransform) .attr("height", function(d) { return y.rangeBand(); }) .attr("width", function(d) { return (x(d.endDate) - x(d.startDate)); }) .on("mouseover", function(d){ div.transition() .duration(200) .style("opacity", .9); div.html("HandlerID: " + d.taskName + "<br>" + "startDate: " + dateFormat(d.startDate) + "<br/>" + "endDate: " + dateFormat(d.endDate) + "<br/>" + "% Insertions: " + d3.round(d.status,2) + "%" + "<br/>" + "Insertions: " + numFormat(d.insertions) ) .style("left", (d3.event.pageX) + "px") .style("top", (d3.event.pageY - 28) + "px"); }) .on("mouseout",function(d){ div.transition() .duration(500) .style("opacity", 0); }); var today = new Date(); var dd = today.getDate(); var mm = today.getMonth()+1; //January is 0! var yyyy = today.getFullYear(); if(dd<10) { dd='0'+dd } if(mm<10) { mm='0'+mm } today = yyyy+'-'+mm+'-'+dd; today = parseDate(today); //document.write(today); svg.append("line") .attr("x1", today) .attr("y1", 0) .attr("x2", today) .attr("y2", height - margin.top - margin.bottom) .style("stroke-width", 2) .style("stroke", "red") .style("fill", "none"); Просто датируй сегодня. Не нужно получать дату, месяц и год, потому что она вернет строку. Все, что вам нужно сделать, это поместить дату в вашу переменную x в jive с ее доменом
var today = new Date(); var dd = today.getDate(); //<<===== no need var mm = today.getMonth()+1; //January is 0! //<<===== no need var yyyy = today.getFullYear(); //<<===== no need svg.append("line") .attr("x1", x(today)) //<<== change your code here .attr("y1", 0) .attr("x2", x(today)) //<<== and here .attr("y2", height - margin.top - margin.bottom) .style("stroke-width", 2) .style("stroke", "red") .style("fill", "none");