Vis.js重绘操作

在节点上定义形状：
network.on(“afterDrawing”, function (ctx) {//矩形放入点中
var nodeId =1;
var nodePosition = network.getPositions([nodeId]);
ctx.strokeStyle = ‘green’;
ctx.fillStyle = ‘green’;
ctx.rect(nodePosition[nodeId].x, nodePosition[nodeId].y-30,5,60);
ctx.fill(); //x坐标 y坐标 宽，长
ctx.stroke();
});

对关系线的设置:重绘关系线的颜色
//先调用network.on（）方法

network.on(“afterDrawing”, function (ctx) {
ctxnew = ctx;
});
//然后
function L1() {
var c1=network.canvas.body.edges.line1.getFormattingValues().color;
//获取单条关系线的颜色
if(c1==‘limeGreen’){
network.canvas.body.edges.line1.options.color.color=‘red’;
//设置单条关系线的颜色
network.canvas.body.edges.line1.draw(ctxnew);
//传入关系线的对象
network.redraw();
//进行重绘
};
if(c1==‘red’){
network.canvas.body.edges.line1.options.color.color=‘limeGreen’;
network.canvas.body.edges.line1.draw(ctxnew);
network.redraw();
};
}
window.onload = function() {
//每6秒自动颜色交替变换
setInterval(function() {L1()},6000);//颜色不会出现同步
}

Vis.js对关系线的设置:关系线虚线设置
dashes:false/true/[5,5]/[10,10]/[***,***]
在Vis.js中关系线的虚线添加了线冒属性：lineCap=’round’,默认是butt，还可设置为square共三种。
具体代码参考：
https://blog.csdn.net/houyanhua1/article/details/79879481

实线是采用默认的butt，但是当使用虚线时，所有的实线线冒属性都会跟随虚线变成round，所以可以修改vis.js源码，手动增加线冒默认属性。这样当调用虚线属性时，实线就不会再有虚线的线冒了。

对节点的设置:重绘节点

//先调用network.on（）方法

network.on(“afterDrawing”, function (ctx) {
ctxnew = ctx;
});
//然后
function N1(){

var c1=network.canvas.body. nodes. node45.getFormattingValues().color;
// 此处获取的是边框颜色
network.canvas.body.nodes.node45.options.color.border = ‘green’;
//获取要重绘的节点和要重绘的目标（边框/节点填充的颜色）
network.canvas.body.nodes.node45.draw(ctxnew);
//传入关系线的对象
network.redraw();//进行重绘

}