Chart Zoom and Default Topology
Created by: egaoneko
- Chart Zoom
chart(display, {
padding: {
left: 60
},
height: 400,
axis: [{
data: statistics,
x: {
type: "block",
domain: "date"
},
y: {
type: "range",
domain: [0, post_max_cnt],
step: 4,
line: true
},
area: {
width: "100%",
height: "100%"
}
}, {
x: {
hide: true
},
y: {
domain: [0, comment_max_cnt],
orient: "right"
},
area: {
width: "100%",
height: "100%"
},
extend: 0
}],
brush: [{
type: "column",
target: "posts",
axis: 0,
colors: [0],
animate: true
}, {
type: "line",
target: "comments",
axis: 1,
colors: [2],
animate: true
}, {
type: "scatter",
target: "comments",
size: 10,
axis: 1,
colors: [2]
}],
widget: [{
type: "title",
text: capitalizeFirstLetter(method) + " Overview",
align: "start"
}, {
type: "title",
text: "Counts",
align: "start",
orient: "center",
dx: -55,
dy: -90
}, {
type: "tooltip",
format: function (k, v) {
return v;
},
brush: [0, 2, 3, 4]
}, {
type : "zoom",
}],
style: {
scatterBorderWidth: 1.5,
titleFontSize: "11px",
titleFontWeight: "bold"
},
format: function (v) {
if (typeof(v) == "number") {
return ((v > 1000) ? Math.floor(v / 1000) + "k" : v);
}
return v;
}
});
다음과 같이 차트에서 zoom을 사용하려고 합니다. 줌은 예상대로 확대가 되는데, 확대되는 zoom이 두개나 생성되네요.
brush: [{
type: "column",
target: "posts",
axis: 0,
colors: [0],
animate: true
}, {
type: "line",
target: "comments",
axis: 1,
colors: [2],
animate: true
}, {
type: "scatter",
target: "comments",
size: 10,
axis: 1,
colors: [2]
}],
현재 zoom이 되는 모습이 posts 한번, comments 한번 해서 두번 zoom을 하는 것 같습니다. 이를 posts에서만 zoom하는 방법이 있나요?
- Topology
topology를 생성할 때 한 노드를 선택되게 하거나 혹은 생성 후에 특정 노드를 선택할 방법이 있나요?
마지막으로 topology의 이벤트 생성시 nodeclick이나 edgeclick은 sample을 바탕으로 하면 잘 동작합니다. sample에 없는 click이나 dbclick 같은 이벤트를 사용하고 싶은데, 정의해도 동작을 하지 않습니다.
click: function (data, e) {
console.log("nodeclick ---------------------");
console.log(data);
}
'click': function (data, e) {
console.log("nodeclick ---------------------");
console.log(data);
}
'topology.click': function (data, e) {
console.log("nodeclick ---------------------");
console.log(data);
}
상단과 같이 세가지 다 사용해봤는데, 작동하지를 않습니다.