jstopoVue版本可配置【虚线,实现,曲线,折线】连线方式,带动画【加机房设备伪3d版】

74 阅读1分钟

1、jstopoVue版本可配置【虚线,实现,曲线,折线】连线方式

easyTopo.png

效果展示网址:jstopo.top

init(){
    const dom = this.$refs["jstopo"];
    let w = dom.width = dom.clientWidth,
    h = dom.height = dom.clientHeight;
    const ctx = dom.getContext("2d"),lineWidth = 2;
    this.ctx = ctx,
    this.w = w,
    this.h = h,
    this.lineWidth = lineWidth;
    this.rePaintOnce(ctx, w, h, lineWidth);
    this.rePaint(ctx, w, h, lineWidth);
},

2、机房设备分布伪3d效果(可配置设备)

machineview.png