d3js 다중 계열 선 차트, 동그라미 추가

나는 내 간단한 서버에서 작업하고 있지만 어떤 이유로 bl.ock을 만들 때 작동하지 않습니다. http://bl.ocks.org/atmccann/6673536.d3js 다중 계열 선 차트, 동그라미 추가

var network = svg.selectAll(".network") 
    .data(networks) 
    .enter().append("g") 
    .attr("class", "network"); 

    console.log(networks) 

    network.append("path") 
    .attr("class", "line") 
    .attr("d", function(d) { return line(d.values); }) 
    .style("stroke", function(d) { return color(d.name); }); 

    network.append("text") 
    .datum(function(d) { return {name: d.name, value: d.values[d.values.length - 1]}; }) 
    .attr("transform", function(d) { return "translate(" + x(d.value.date) + "," + y(d.value.rating) + ")"; }) 
    .attr("x", 3) 
    .attr("dy", ".35em") 
    .text(function(d) { return d.name; }); 


    network.append("circle") 
    .attr("r", 5) 
    .attr("cx", function(d) { return d.date; }) 
    .attr("cy",function(d) { return d.rating; }) 
    .style("stroke", function(d) { return color(d.name); }); 
    .style("fill", function(d) { return color(d.name); }); 
});

을하지만 정확하게 라인에 원을 추가되지 않은 : 여기 내가 가진 무엇 라인의 해당 색상으로 내 멀티 시리즈 라인 차트에 각 날짜에 원을 추가하고 싶습니다. 내 블록이 효과가 없으므로별로 도움이되지 않지만 코드 전체가 거기에 있다는 것을 알고 있습니다.

도움말을 보내 주시면 감사하겠습니다.

출처

2013-09-23 allison

데이터에 문제가있는 것 같습니다. 그것은 다음과 같이 객체로 파싱 점점 :

코드는 그래서 당신이 "data.tsv"파일의 내용을 확인하고 모양이 어떻게되는지 확인한다 이것보다 상당히 다른 무언가를 기대하고있다처럼 보이는

{ 
    CBS: "9.86" 
    CW: "13.959" 
    FOX: "0" 
    ION Television: "7.102" 
    MyNetworkTV: "1.189" 
    NBC: "0" 
    PBS: "13.419" 
    UPN: "0" 
    WB: "4.207" 
    date ABC: "2002" 
}

출처

2013-09-23 20:30:26

당신은 당신이 "이상", "날짜"코드로 변경해야하기에서 X 축을 변경할 수 있습니다 원

와 멀티 시리즈 라인 차트의 창조의 내 예를 볼 수 있습니다. 하지만 각 날짜마다 서클을 구현하는 기본 아이디어를 얻을 수 있습니다. 내 예에서는 원이 거기에 있지만 거기에 개찰이 없으면 숨겨져 있습니다. 여기

참조 예,

Multi Series Line chart with circle example

출처

2017-09-13 06:29:59

d3js 다중 계열 선 차트, 동그라미 추가

답변

관련 문제