zoom
This commit is contained in:
parent
0f6e1530c8
commit
569a6be800
5 changed files with 31 additions and 1 deletions
|
@ -264,6 +264,8 @@
|
||||||
"soup": {},
|
"soup": {},
|
||||||
"tea": {}
|
"tea": {}
|
||||||
},
|
},
|
||||||
|
"tech": {
|
||||||
|
},
|
||||||
"miscellaneous": {
|
"miscellaneous": {
|
||||||
"bicycle": {},
|
"bicycle": {},
|
||||||
"make-up": {},
|
"make-up": {},
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
<meta charset="utf-8" />
|
||||||
<script src="/static/oxjs/min/Ox.js"></script>
|
<script src="/static/oxjs/min/Ox.js"></script>
|
||||||
<script>
|
<script>
|
||||||
function pandora_api(action, data, callback) {
|
function pandora_api(action, data, callback) {
|
||||||
|
|
|
@ -19,3 +19,9 @@ body {
|
||||||
stroke: #ccc;
|
stroke: #ccc;
|
||||||
stroke-width: 1.5px;
|
stroke-width: 1.5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.zoom {
|
||||||
|
position: fixed;
|
||||||
|
top: 5px;
|
||||||
|
right: 5px;
|
||||||
|
}
|
||||||
|
|
|
@ -7,6 +7,10 @@
|
||||||
<title>Ontology Tree</title>
|
<title>Ontology Tree</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div class="zoom">
|
||||||
|
<button class="plus">+</button>
|
||||||
|
<button class="minus">-</button>
|
||||||
|
</div>
|
||||||
<script src="index.js"></script>
|
<script src="index.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -51,6 +51,22 @@ function resize() {
|
||||||
update(root);
|
update(root);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function zoom(size) {
|
||||||
|
height = size;
|
||||||
|
tree.size([height, width]);
|
||||||
|
svg.attr("width", width).attr("height", height + margin.top + margin.bottom)
|
||||||
|
document.querySelector('svg').attributes.height.value = height + margin.top + margin.bottom
|
||||||
|
resize()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
document.querySelector('.zoom button.plus').addEventListener('click', function(event) {
|
||||||
|
zoom(height*1.5)
|
||||||
|
})
|
||||||
|
document.querySelector('.zoom button.minus').addEventListener('click', function(event) {
|
||||||
|
zoom(height/1.5)
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
function get_color(d) {
|
function get_color(d) {
|
||||||
if (d.children || d._children) {
|
if (d.children || d._children) {
|
||||||
|
@ -95,7 +111,8 @@ function update(source) {
|
||||||
})
|
})
|
||||||
.text(function(d) {
|
.text(function(d) {
|
||||||
if (d.children || d._children) {
|
if (d.children || d._children) {
|
||||||
return d.name;
|
//return d.name;
|
||||||
|
return d.name + '(' + (d.children || d._children).length +')';
|
||||||
}
|
}
|
||||||
return d.name + ' (' + d.size + ')';
|
return d.name + ' (' + d.size + ')';
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in a new issue