Giter Site home page Giter Site logo

Comments (9)

az6161311 avatar az6161311 commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

from logicflow.

wumail avatar wumail commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法：
1、事先记录好各节点各边的原始层级
2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

from logicflow.

az6161311 avatar az6161311 commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法： 1、事先记录好各节点各边的原始层级 2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

@wumail
我使用你修复后的，发现每次选中时置顶（toFront）会记录在history中，按照我这边的需求，应该是递增模式，选中、取消选中按照节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。但是这个过程不记录在history中，跟文档中的默认模式有点相似，唯一的区别就是会存储zIndex。使用之前的版本，我大致的代码是这么实现这个过程的，比较粗暴...

if (model.BaseType == "node") {
                if (model.isSelected && model._zIndex == undefined) { 
                    model._zIndex = model.zIndex;
                    var element1 = $(This.rootEl).parents(".lf-node").eq(0);
                    var element2 = $(This.rootEl).parents(".lf-base").eq(0).find(".lf-node:last").eq(0);
                    model._zIndex_1_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element1);
                    model._zIndex_2_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element2);
                    element1.insertAfter(element2);
                    element2.insertBefore($(This.rootEl).parents(".lf-base").find(".lf-node").eq(model._zIndex_1_Index)); 
                }
                else if (!model.isSelected && model._zIndex != undefined) { 
                    model._zIndex = undefined;
                    model._zIndex_1_Index = undefined;
                    model._zIndex_2_Index = undefined;
                }
            }

from logicflow.

wumail avatar wumail commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法： 1、事先记录好各节点各边的原始层级 2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

@wumail 我使用你修复后的，发现每次选中时置顶（toFront）会记录在history中，按照我这边的需求，应该是递增模式，选中、取消选中按照节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。但是这个过程不记录在history中，跟文档中的默认模式有点相似，唯一的区别就是会存储zIndex。使用之前的版本，我大致的代码是这么实现这个过程的，比较粗暴...

if (model.BaseType == "node") {
                if (model.isSelected && model._zIndex == undefined) { 
                    model._zIndex = model.zIndex;
                    var element1 = $(This.rootEl).parents(".lf-node").eq(0);
                    var element2 = $(This.rootEl).parents(".lf-base").eq(0).find(".lf-node:last").eq(0);
                    model._zIndex_1_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element1);
                    model._zIndex_2_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element2);
                    element1.insertAfter(element2);
                    element2.insertBefore($(This.rootEl).parents(".lf-base").find(".lf-node").eq(model._zIndex_1_Index)); 
                }
                else if (!model.isSelected && model._zIndex != undefined) { 
                    model._zIndex = undefined;
                    model._zIndex_1_Index = undefined;
                    model._zIndex_2_Index = undefined;
                }
            }

「修复后的」，修复是指「overlapMode设置为1时，选中节点无法置顶」这个吗？

from logicflow.

az6161311 avatar az6161311 commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法： 1、事先记录好各节点各边的原始层级 2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

@wumail 我使用你修复后的，发现每次选中时置顶（toFront）会记录在history中，按照我这边的需求，应该是递增模式，选中、取消选中按照节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。但是这个过程不记录在history中，跟文档中的默认模式有点相似，唯一的区别就是会存储zIndex。使用之前的版本，我大致的代码是这么实现这个过程的，比较粗暴...

if (model.BaseType == "node") {
                if (model.isSelected && model._zIndex == undefined) { 
                    model._zIndex = model.zIndex;
                    var element1 = $(This.rootEl).parents(".lf-node").eq(0);
                    var element2 = $(This.rootEl).parents(".lf-base").eq(0).find(".lf-node:last").eq(0);
                    model._zIndex_1_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element1);
                    model._zIndex_2_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element2);
                    element1.insertAfter(element2);
                    element2.insertBefore($(This.rootEl).parents(".lf-base").find(".lf-node").eq(model._zIndex_1_Index)); 
                }
                else if (!model.isSelected && model._zIndex != undefined) { 
                    model._zIndex = undefined;
                    model._zIndex_1_Index = undefined;
                    model._zIndex_2_Index = undefined;
                }
            }

「修复后的」，修复是指「overlapMode设置为1时，选中节点无法置顶」这个吗？

对，使用的是你这一版签入的代码。

from logicflow.

wumail avatar wumail commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法： 1、事先记录好各节点各边的原始层级 2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

@wumail 我使用你修复后的，发现每次选中时置顶（toFront）会记录在history中，按照我这边的需求，应该是递增模式，选中、取消选中按照节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。但是这个过程不记录在history中，跟文档中的默认模式有点相似，唯一的区别就是会存储zIndex。使用之前的版本，我大致的代码是这么实现这个过程的，比较粗暴...

if (model.BaseType == "node") {
                if (model.isSelected && model._zIndex == undefined) { 
                    model._zIndex = model.zIndex;
                    var element1 = $(This.rootEl).parents(".lf-node").eq(0);
                    var element2 = $(This.rootEl).parents(".lf-base").eq(0).find(".lf-node:last").eq(0);
                    model._zIndex_1_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element1);
                    model._zIndex_2_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element2);
                    element1.insertAfter(element2);
                    element2.insertBefore($(This.rootEl).parents(".lf-base").find(".lf-node").eq(model._zIndex_1_Index)); 
                }
                else if (!model.isSelected && model._zIndex != undefined) { 
                    model._zIndex = undefined;
                    model._zIndex_1_Index = undefined;
                    model._zIndex_2_Index = undefined;
                }
            }

「修复后的」，修复是指「overlapMode设置为1时，选中节点无法置顶」这个吗？

对，使用的是你这一版签入的代码。

我有点没太理解，提出这个问题时应该还没有发布新版本才是，「这一版签入的代码」是什么代码🧐

from logicflow.

az6161311 avatar az6161311 commented on June 19, 2024

@wumail 你好，请问如果我想实现 ： 递增模式，节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。应该怎么实现？

目前看没有什么太好的实现方法，堆叠模式这部分代码里的限制比较多，理论上节点取消选中后是否恢复层级跟是何种堆叠模式没有关系，所以目前来说要实现你说的这种效果比较麻烦，有一个比较hack的方法： 1、事先记录好各节点各边的原始层级 2、通过

lf.graphModel.clearSelectElements = function(){
+   const zIndex = .... //获取元素的原始 层级
     this.selectElements.forEach(element => {
      element?.setSelected(false);
+    element.setZIndex(zIndex); 
    });
    this.selectElements.clear();
    /**
     * 如果堆叠模式为默认模式，则将置顶元素重新恢复原有层级
     */
    if (this.overlapMode === OverlapMode.DEFAULT) {
      this.topElement?.setZIndex();
    }
}

覆盖原本的clearSelectElements(clearSelectElements方法会在每次选中元素前调用)，+号标记行是在原clearSelectElements方法上新增的

@wumail 我使用你修复后的，发现每次选中时置顶（toFront）会记录在history中，按照我这边的需求，应该是递增模式，选中、取消选中按照节点和边被选中，会被显示在最上面。当取消选中后，元素会恢复之前的层级。但是这个过程不记录在history中，跟文档中的默认模式有点相似，唯一的区别就是会存储zIndex。使用之前的版本，我大致的代码是这么实现这个过程的，比较粗暴...

if (model.BaseType == "node") {
                if (model.isSelected && model._zIndex == undefined) { 
                    model._zIndex = model.zIndex;
                    var element1 = $(This.rootEl).parents(".lf-node").eq(0);
                    var element2 = $(This.rootEl).parents(".lf-base").eq(0).find(".lf-node:last").eq(0);
                    model._zIndex_1_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element1);
                    model._zIndex_2_Index = $(This.rootEl).parents(".lf-base").find(".lf-node").index(element2);
                    element1.insertAfter(element2);
                    element2.insertBefore($(This.rootEl).parents(".lf-base").find(".lf-node").eq(model._zIndex_1_Index)); 
                }
                else if (!model.isSelected && model._zIndex != undefined) { 
                    model._zIndex = undefined;
                    model._zIndex_1_Index = undefined;
                    model._zIndex_2_Index = undefined;
                }
            }

「修复后的」，修复是指「overlapMode设置为1时，选中节点无法置顶」这个吗？

对，使用的是你这一版签入的代码。

我有点没太理解，提出这个问题时应该还没有发布新版本才是，「这一版签入的代码」是什么代码🧐

不是合并代码了嘛？我不是能下载下来编译嘛....

from logicflow.

wumail avatar wumail commented on June 19, 2024

明白了，我后续跟进下这个问题，近期有些忙

from logicflow.

az6161311 avatar az6161311 commented on June 19, 2024

明白了，我后续跟进下这个问题，近期有些忙

3Q

from logicflow.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.