Добавление горизонтальной и вертикальной полосы прокрутки для дерева d3-2way для многоуровневого дерева

Question

Я имел в виду виджет d3, http://bl.ocks.org/kanesee/5d6c48bffd4ea31201fb. Я хочу, чтобы дерево было еще больше увеличено как сверху, так и снизу. По мере того как холст страницы исправлен, я хочу добавить полосы прокрутки, чтобы при увеличении графика я смог полностью увидеть диаграмму.

{ 
    "name": "Heirachy", 
    "parents": [ 
     { 
      "name": "Parent1", 
      "isparent": true 
     }, 
     { 
      "name": "Parent2", 
      "isparent": true 
     }, 
     { 
      "name": "Parent3", 
      "isparent": true, 
      "parents": [ 
       { 
        "name" : "inner-parent3", 
        "isparent" : true, 
        "parents":[ 
         { 
          "name" : "inner-most-parent3", 
          "isparent" : true 
         } 
        ] 
       }, 
       { 
        "name" : "outer-parent3", 
        "isparent" : true 
       } 
      ] 
     } 
    ], 
    "children": [ 
     { 
      "name": "Childern1", 
      "isparent": false 
     }, 
     { 
      "name": "Childern2", 
      "isparent": false 
     }, 
     { 
      "name": "Childern3", 
      "isparent": false, 
      "children": [ 
       { 
        "name" : "inner-1-children3", 
        "isparent" : false 
       }, 
       { 
        "name" : "inner-2-children3", 
        "isparent" : false 
       } 
      ] 
     }, 
     { 
      "name": "Childern4", 
      "isparent": false 
     } 
    ] 
} 

Это мои данные json, это делает дерево расти вертикально.

Answer 1

Заверните его в DIV и добавить в CSS:

overflow: scroll; 

Answer 2

просто включают переполнение: авто; В CSS для perticular ДИВ

overflow:auto; 

новый

Добавить родительский DIV для #categoryHierarchy DIV

HTML

<div id="parentDiv"> 
    <div id="categoryHierarchy"></div> 
</div> 

CSS:

#parentDiv { 
    margin:0 auto; 
    overflow:auto; 
    max-width:960px; // set width according to your requirement 
    max-height:448px; // set height according to your requirement 
}