Authored by qinchao

mha

... ... @@ -74,19 +74,18 @@
<style>
.node-container{
position: relative;
//position: relative;
//position: absolute;
z-index: 9999;
width: 300px;
height: 100px;
height: 106px;
border: 1px solid #999;
border-radius: 3px;
overflow: hidden;
}
.node-container .node-container-title{
color: white;
// color: white;
font-size: 2em;
float:left;
height:40px;
... ... @@ -95,7 +94,7 @@
.node-container .node-container-content{
margin-top:40px;
height: 100%;
background-color: white;
background-color: red;
}
.node-container .node-container-title-button-div{
... ... @@ -180,6 +179,26 @@
}
function drawHtml2(cfg) {
var model = cfg.model;
var container = Util.createDOM('<div class="node-container"></div>');
var title = Util.createDOM('<div class="widget-title" style="height: 36px;"></div>');
if(!model.disabledFlag){
title.appendChild(Util.createDOM('<h5>'+model.label+'</h5>'));
var a = Util.createDOM('<a href="#" onclick="alert(1)" style="float:right;margin-right: 10px;"><H5 style="padding-right:0px;padding-left:0px;"><span class="glyphicon glyphicon-info-sign"></span></H5></a>');
title.appendChild(a);
}else{
title.appendChild(Util.createDOM('<h5>'+model.label+'<small style="margin-left:5px;font-size:8px;color:red;">down</small></h5>'));
}
var content = Util.createDOM('<div class="widget-content" style="height: 70px;">'+model.ip+'</div>');
container.appendChild(title);
container.appendChild(content);
return container;
}
function createTopo(data) {
// 第二步:注册节点
... ... @@ -192,39 +211,15 @@
G6.registNode('customNode', {
cssSize: true, // 不使用内部 size 作为节点尺寸
getHtml: function(cfg){
var model = cfg.model;
var container = Util.createDOM('<div class="node-container"></div>');
var title = Util.createDOM('<div class="node-container-title">'+model.label+'</div>');
container.appendChild(title);
if(!model.disabledFlag){
var buttonDiv = Util.createDOM('<div class="node-container-title-button-div"></div>');
var btn = Util.createDOM('' +
' <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>' +
' ');
btn.addEventListener('click', function(){
alert(1111);
});
buttonDiv.appendChild(btn);
btn = Util.createDOM('' +
' <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>' +
'');
btn.addEventListener('click', function(){
alert(222);
});
buttonDiv.appendChild(btn);
container.appendChild(buttonDiv);
}
var content = Util.createDOM('<div class="node-container-content">'+model.ip+'</div>');
container.appendChild(content);
return container;
return drawHtml2(cfg);
}
}, 'html');
var nodes = data.nodes;
var edges = data.edges;
var tree = new G6.Net({
behaviourFilter: ['wheelZoom', 'dragNode','dragBlank', 'dragCanvas'],
id: "mhaTopoDiv" , // 此处替换容器id
fitView: 'autoSize' // 自动缩放 autoSize autoZoom
/* ,layoutCfg: {
... ... @@ -237,27 +232,15 @@
}
}*/
});
tree.source(data.nodes, data.edges);
tree.source(nodes, edges);
tree.node().style({
stroke: null, // 去除默认边框
fillOpacity: 1
}).color( function(obj){
var rst;
})/*.color( function(obj){
if(obj.disabledFlag){
rst = '#aaa';
}else{
if(obj.noMaster==1){
//rst = '#F90426';
//rst = '#87CEEB';
rst = '#3B89CF';
}else{
rst = '#3B89CF';
return '#aaa';
}
}
return rst;
}).label('serverId').shape('customNode');
})*/.label('serverId').shape('customNode');
tree.edge().style({
//stroke: 'black',
lineWidth: 2,
... ... @@ -291,6 +274,39 @@
}
function drawHtml(cfg) {
var model = cfg.model;
var container = Util.createDOM('<div class="node-container"></div>');
var title = Util.createDOM('<div class="node-container-title">'+model.label+'</div>');
container.appendChild(title);
if(!model.disabledFlag){
var buttonDiv = Util.createDOM('<div class="node-container-title-button-div"></div>');
var btn = Util.createDOM('' +
' <span class="glyphicon glyphicon-info-sign" aria-hidden="true"></span>' +
' ');
btn.addEventListener('click', function(){
alert(1111);
});
buttonDiv.appendChild(btn);
btn = Util.createDOM('' +
' <span class="glyphicon glyphicon-minus" aria-hidden="true"></span>' +
'');
btn.addEventListener('click', function(){
alert(222);
});
buttonDiv.appendChild(btn);
container.appendChild(buttonDiv);
}
var content = Util.createDOM('<div class="node-container-content">'+model.ip+'</div>');
container.appendChild(content);
return container;
}
function drawCard(cfg, group){
var model = cfg.model;
var width = 300;
... ...