d3, js에서 다른 svg 위에 svg를 추가하는 방법

d3.js를 사용하여 누적 막대 그래프를 작성하고 있습니다. 이 그래프를 참조하고 있습니다. http://bl.ocks.org/mbostock/3886208 d3, js에서 다른 svg 위에 svg를 추가하는 방법

같은 값을 가진 막대에 다른 색상의 작은 사각형을 추가하고 싶습니다. 25 44 년 및 45 64 년의 인구 같으면이 예를 들어 그때 CA 관련된 두 막대 10, 10의 제곱 (폭, 높이)를 표시 할 graph- . 이것은 내가하고있는 일이지만 막대에 표시되지 않습니다.

var equalBar = svg.selectAll(".equalBar") 
      .data(data) 
      .enter().append("g") 
      .attr("class", "equalBar") 
      .attr("transform", function(d){ return "translate(" + x(d.states) + ",0"; }); 

equalBar.selectAll("rect") 
.data(function(d) { return d.ages;}) 
.enter().append("rect") 
.attr("width", 10) 
.attr("y", function(d){ 
    return y(d.y1); 
}) 
.attr("height", function(d) 
     { return 10; }) 
.style("fill", "green");

도움을 주셔서 감사합니다.

출처

2013-08-27 parthvijay

당신이하려는 것은 실제로 데이터 관리에 대한 D3 접근법과 호환되지 않습니다. 선택에 대한 아이디어는 데이터 항목에 의존하여 독립적 인 반면, 귀하의 경우에는 명시 적으로 비교하려고합니다.

이렇게하기 위해 취하는 접근법은 이러한 비교 결과가 포함 된 새로운 데이터 구조를 만드는 것입니다. 즉, 각 모집단 그룹에 대해 어떤 다른 그룹과 동일한 지 알려줍니다. 그런 다음이 새 데이터를 사용하여 적절한 사각형을 만들 수 있습니다.

출처

2013-08-27 18:55:23

동등한 막대 또는 그 막대의 측면에 별표를 사용할 수있는 다른 방법이 있습니까? 부트 스트랩의 아이콘을 사용하여 이것을 구현하려고했기 때문에 html 요소가 있어야 원하는 곳에 표시 할 수 있습니다. 그러나이 솔루션은 나를 위해 작동하지 않습니다. – parthvijay

마커로 사용하는 것과 관계없이 마커의 위치를 직접 계산해야합니다. –

d3, js에서 다른 svg 위에 svg를 추가하는 방법

답변

관련 문제