G6
业火之理
这个作者很懒,什么都没留下…
展开
-
【G6】G6学习笔记(四)
前言我一开始还没太注意树图和普通图的区别,直到我用自定义新增和减少才发现树图是完全不一样的逻辑。树图树图之间的节点关系是通过配置children来确定的,同时,必须有layout布局,来为其自动计算坐标。树图的的新增和减少应该在每个node上进行操作,这样新增的节点会与需要的节点之间产生联系。要么就直接修改元数据的方式进行新增或者删除。...原创 2020-08-13 11:32:47 · 1189 阅读 · 1 评论 -
【G6】G6学习笔记(三)
前言上一篇已经可以修改label以及一些配置属性方面的东西,但是增加删除节点,增加删除线没写,这篇来探究下如何实现。切换模式其实不切换模式也可以弄,官方给的例子是切换模式做,因为点击行为做出了改变。主要就是注册行为,当切换到该模式下点击然后要拿到graph,调用graph的addItem,拿到鼠标位置增加新节点G6.registerBehavior('click-add-node', { // Set the events and the corresponding responsin原创 2020-08-12 21:51:28 · 1499 阅读 · 0 评论 -
【G6】G6学习笔记(二)
前言再次稍微研究了下这玩意,这玩意难用的地方在于,第一、文档写的很混乱,有很多漏写的。 第二、报错经常是它内部报错,得看它里面到底咋回事才知道为啥出现错误。第三、卸载比较诡异,如果有路由相互切换的话,可能得踩点坑。事件首先事件方面,可以通过graph.on监听事件,可以监听这些: // click?: string; // mousedown?: string; // mouseup?: string; // dblclick?: string;原创 2020-08-11 18:15:01 · 5590 阅读 · 3 评论 -
【G6】G6学习笔记(一)
前言记录下g6学习笔记以及心得。官方入门案例入门案例是2个圆中间一根线连着,我粗略研究了下,发现new G6里的配置项就是根据配置项制作canvas,然后结合数据源做出图来。其中container 是id对应的挂载点,会把canvas插进去。我使用cra然后修改成react :import React, { useEffect } from "react";import G6 from "@antv/g6";const data = { nodes: [ { id: "原创 2020-08-01 23:28:00 · 2846 阅读 · 0 评论