Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
2.1k views
in Technique[技术] by (71.8m points)

antv g6 tooltip显示位置不对

蚂蚁金服图表工具antv G6在使用过程中不知道为什么tooltip显示的位置跟节点相差距离好大

this.graph = new G6.Graph({
        container: 'topology',
        height: this.height,
        width: this.width,
        modes: {
          default: [{
            type: 'tooltip',
            offset: 10,
            formatText(model) {
              const text = 'label: ' + model.label
              return text
            }
          }],
          layout: {
            type: 'grid',
            begin: [20, 20],
            preventOverlap: true,
            preventOverlapPadding: 20,
            nodeSize: 30
          }
        },
        defaultNode: {
          type: 'circle',
          size: [50, 50],
          labelCfg: {
            position: 'bottom'
          }
        },
        defaultEdge: {
          size: 2,
          color: '#DCDFE6'
        }
      })
      // this.graph.data({ nodes: this.nodes, edges: this.edges })
      this.graph.data({ nodes: [{ id: '0000', label: 'testSession', x: 300, y: 300, img: appNode }], edges: [] })
      this.graph.render()

B3C0F8D3-12D4-4c03-B5D7-1E658B96B48B.png

官网上面的显示倒是正常的,不知道为什么到我本地相差这么多


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

设置.g6-tooltip父元素position:relative;


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...