From 22ddaddf6aa2b12b3f278016fe1913f6ffa738a3 Mon Sep 17 00:00:00 2001 From: Yanyan-Wang Date: Tue, 1 Dec 2020 15:57:28 +0800 Subject: [PATCH] fix: state style restore for non-circle shapes; --- CHANGELOG.md | 3 + docs/api/graphFunc/stack.en.md | 4 +- docs/api/graphFunc/stack.zh.md | 4 +- examples/case/australiaFire/demo/index.js | 7 +- examples/case/largeGraph/demo/index.js | 22 +- package.json | 2 +- report.20201201.151408.70725.0.001.json | 956 ++++++++++++++++++++++ src/global.ts | 2 +- src/interface/item.ts | 2 +- src/item/item.ts | 67 +- src/shape/shapeBase.ts | 69 +- stories/Layout/component/dagre-layout.tsx | 253 ++++-- stories/Shape/component/rect.tsx | 49 ++ stories/Shape/shape.stories.tsx | 4 +- tests/unit/graph/svg-spec.ts | 6 +- tests/unit/shape/combo-spec.ts | 2 +- tests/unit/shape/node-spec.ts | 2 +- tests/unit/state/edge-state-spec.ts | 14 +- tests/unit/state/refactor-state-spec.ts | 25 +- 19 files changed, 1363 insertions(+), 130 deletions(-) create mode 100644 report.20201201.151408.70725.0.001.json create mode 100644 stories/Shape/component/rect.tsx diff --git a/CHANGELOG.md b/CHANGELOG.md index e8c8c77e3da..6d0f7205240 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,8 @@ # ChangeLog +#### 4.0.3 +- fix: state style restore for non-circle shapes; + #### 4.0.2 - fix: node and edge state style with update problem; - fix: import lib problem; diff --git a/docs/api/graphFunc/stack.en.md b/docs/api/graphFunc/stack.en.md index 21843252c95..0a35ae9ff22 100644 --- a/docs/api/graphFunc/stack.en.md +++ b/docs/api/graphFunc/stack.en.md @@ -6,9 +6,9 @@ order: 13 ## pushStack(action, data, stackType) Push operation。 -Implemented the undo function, refer to [here](https://github.com/antvis/G6/blob/timebar-0826/src/plugins/toolBar/index.ts#L182) +Implemented the undo function, refer to [here](https://github.com/antvis/G6/blob/master/src/plugins/toolBar/index.ts#L184) -Implemented the redo function, refer to[here](https://github.com/antvis/G6/blob/timebar-0826/src/plugins/toolBar/index.ts#L234) +Implemented the redo function, refer to[here](https://github.com/antvis/G6/blob/master/src/plugins/toolBar/index.ts#L271) **参数** diff --git a/docs/api/graphFunc/stack.zh.md b/docs/api/graphFunc/stack.zh.md index 599adfb8e58..8e97e8c0ac8 100644 --- a/docs/api/graphFunc/stack.zh.md +++ b/docs/api/graphFunc/stack.zh.md @@ -6,9 +6,9 @@ order: 13 ## pushStack(action, data, stackType) 入栈操作。 -实现 undo 功能，可参考[这里](https://github.com/antvis/G6/blob/timebar-0826/src/plugins/toolBar/index.ts#L182) +实现 undo 功能，可参考[这里](https://github.com/antvis/G6/blob/master/src/plugins/toolBar/index.ts#L184) -实现 redo 功能，可参考[这里](https://github.com/antvis/G6/blob/timebar-0826/src/plugins/toolBar/index.ts#L234) +实现 redo 功能，可参考[这里](https://github.com/antvis/G6/blob/master/src/plugins/toolBar/index.ts#L271) **参数** diff --git a/examples/case/australiaFire/demo/index.js b/examples/case/australiaFire/demo/index.js index a0584587bfd..0a37eb9b895 100644 --- a/examples/case/australiaFire/demo/index.js +++ b/examples/case/australiaFire/demo/index.js @@ -7,8 +7,8 @@ import insertCss from 'insert-css'; insertCss(` #legendContainer{ position: absolute; - top: 50px; - left: 200px; + top: 92px; + left: 8px; width: 100px; height: 100px; } @@ -223,9 +223,8 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/d676014a-0a11-4ea9-9af4-403 .then((res) => res.json()) .then((data) => { const container = document.getElementById('container'); - const width = document.getElementById('container').scrollWidth; - const height = document.getElementById('container').scrollHeight || 500; container.style.backgroundColor = '#000'; + container.style.textAlign = 'center'; const graph = new G6.TreeGraph({ container: 'container', width: height < width ? height : width, diff --git a/examples/case/largeGraph/demo/index.js b/examples/case/largeGraph/demo/index.js index cc3f4999972..0d01f2176e0 100644 --- a/examples/case/largeGraph/demo/index.js +++ b/examples/case/largeGraph/demo/index.js @@ -5,9 +5,6 @@ import insertCss from 'insert-css'; // 推荐将样式添加到自己的样式文件中 // 若拷贝官方代码，别忘了 npm install insert-css insertCss(` - #container { - background-color: #2b2f33; - } .g6-component-contextmenu { position: absolute; z-index: 2; @@ -1375,6 +1372,8 @@ fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/relations.json') descriptionDiv.style.marginTop = '8px'; container.appendChild(descriptionDiv); + container.style.backgroundColor = '#2b2f33'; + CANVAS_WIDTH = container.scrollWidth; CANVAS_HEIGHT = (container.scrollHeight || 500) - 30; @@ -1532,13 +1531,24 @@ fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/relations.json') groupByTypes: false, modes: { default: [ - 'drag-canvas', - 'zoom-canvas', + { + type: 'drag-canvas', + enableOptimize: true + }, + { + type: 'zoom-canvas', + enableOptimize: true, + optimizeZoom: 0.01 + }, 'drag-node', 'shortcuts-call' ], lassoSelect: [ - 'zoom-canvas', + { + type: 'zoom-canvas', + enableOptimize: true, + optimizeZoom: 0.01 + }, { type: 'lasso-select', selectedState: 'focus', diff --git a/package.json b/package.json index e48ade6b835..7c414bba86d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@antv/g6", - "version": "4.0.2", + "version": "4.0.3", "description": "A Graph Visualization Framework in JavaScript", "keywords": [ "antv", diff --git a/report.20201201.151408.70725.0.001.json b/report.20201201.151408.70725.0.001.json new file mode 100644 index 00000000000..e6acb295206 --- /dev/null +++ b/report.20201201.151408.70725.0.001.json @@ -0,0 +1,956 @@ + +{ + "header": { + "reportVersion": 2, + "event": "Allocation failed - JavaScript heap out of memory", + "trigger": "FatalError", + "filename": "report.20201201.151408.70725.0.001.json", + "dumpEventTime": "2020-12-01T15:14:08Z", + "dumpEventTimeStamp": "1606806848411", + "processId": 70725, + "threadId": null, + "cwd": "/Users/shiwu/Documents/GitHub/G6", + "commandLine": [ + "/usr/local/bin/node", + "/Users/shiwu/Documents/GitHub/G6/.cache/tmp-70673-Z8uAaBFRTiB6" + ], + "nodejsVersion": "v12.16.3", + "wordSize": 64, + "arch": "x64", + "platform": "darwin", + "componentVersions": { + "node": "12.16.3", + "v8": "7.8.279.23-node.35", + "uv": "1.34.2", + "zlib": "1.2.11", + "brotli": "1.0.7", + "ares": "1.16.0", + "modules": "72", + "nghttp2": "1.40.0", + "napi": "5", + "llhttp": "2.0.4", + "http_parser": "2.9.3", + "openssl": "1.1.1g", + "cldr": "36.0", + "icu": "65.1", + "tz": "2019c", + "unicode": "12.1" + }, + "release": { + "name": "node", + "lts": "Erbium", + "headersUrl": "https://nodejs.org/download/release/v12.16.3/node-v12.16.3-headers.tar.gz", + "sourceUrl": "https://nodejs.org/download/release/v12.16.3/node-v12.16.3.tar.gz" + }, + "osName": "Darwin", + "osRelease": "19.6.0", + "osVersion": "Darwin Kernel Version 19.6.0: Mon Aug 31 22:12:52 PDT 2020; root:xnu-6153.141.2~1/RELEASE_X86_64", + "osMachine": "x86_64", + "cpus": [ + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 39252090, + "nice": 0, + "sys": 6910830, + "idle": 35128690, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 4580890, + "nice": 0, + "sys": 1388740, + "idle": 75287130, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 27094770, + "nice": 0, + "sys": 5734190, + "idle": 48428620, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 3931670, + "nice": 0, + "sys": 1206200, + "idle": 76118850, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 26171210, + "nice": 0, + "sys": 5310960, + "idle": 49775380, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 3771530, + "nice": 0, + "sys": 1142410, + "idle": 76342760, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 26971130, + "nice": 0, + "sys": 4794280, + "idle": 49492110, + "irq": 0 + }, + { + "model": "Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz", + "speed": 2400, + "user": 3922820, + "nice": 0, + "sys": 1112850, + "idle": 76221010, + "irq": 0 + } + ], + "networkInterfaces": [ + { + "name": "lo0", + "internal": true, + "mac": "00:00:00:00:00:00", + "address": "127.0.0.1", + "netmask": "255.0.0.0", + "family": "IPv4" + }, + { + "name": "lo0", + "internal": true, + "mac": "00:00:00:00:00:00", + "address": "::1", + "netmask": "ffff:ffff:ffff:ffff:ffff:ffff:ffff:ffff", + "family": "IPv6", + "scopeid": 0 + }, + { + "name": "lo0", + "internal": true, + "mac": "00:00:00:00:00:00", + "address": "fe80::1", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 1 + }, + { + "name": "en0", + "internal": false, + "mac": "a4:83:e7:26:15:f8", + "address": "fe80::e0:4bb1:58f0:8bb3", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 6 + }, + { + "name": "en0", + "internal": false, + "mac": "a4:83:e7:26:15:f8", + "address": "10.15.230.77", + "netmask": "255.255.254.0", + "family": "IPv4" + }, + { + "name": "awdl0", + "internal": false, + "mac": "da:7e:d4:9f:98:a1", + "address": "fe80::d87e:d4ff:fe9f:98a1", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 13 + }, + { + "name": "llw0", + "internal": false, + "mac": "da:7e:d4:9f:98:a1", + "address": "fe80::d87e:d4ff:fe9f:98a1", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 14 + }, + { + "name": "utun0", + "internal": false, + "mac": "00:00:00:00:00:00", + "address": "fe80::1250:d13f:4f69:26bf", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 15 + }, + { + "name": "utun1", + "internal": false, + "mac": "00:00:00:00:00:00", + "address": "fe80::b78c:aaf2:169e:d29d", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 16 + }, + { + "name": "en5", + "internal": false, + "mac": "ac:de:48:00:11:22", + "address": "fe80::aede:48ff:fe00:1122", + "netmask": "ffff:ffff:ffff:ffff::", + "family": "IPv6", + "scopeid": 4 + } + ], + "host": "ali-170853shiwu.local" + }, + "javascriptStack": { + "message": "No stack.", + "stack": [ + "Unavailable." + ] + }, + "nativeStack": [ + { + "pc": "0x0000000100164e03", + "symbol": "report::TriggerNodeReport(v8::Isolate*, node::Environment*, char const*, char const*, std::__1::basic_string, std::__1::allocator > const&, v8::Local) [/usr/local/bin/node]" + }, + { + "pc": "0x000000010008645a", + "symbol": "node::OnFatalError(char const*, char const*) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100187c07", + "symbol": "v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100187ba7", + "symbol": "v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100315955", + "symbol": "v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]" + }, + { + "pc": "0x00000001003171ca", + "symbol": "v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100313bfc", + "symbol": "v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/usr/local/bin/node]" + }, + { + "pc": "0x00000001003119fe", + "symbol": "v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]" + }, + { + "pc": "0x000000010031d8f9", + "symbol": "v8::internal::Heap::AllocateRawWithLightRetry(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node]" + }, + { + "pc": "0x000000010031d951", + "symbol": "v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node]" + }, + { + "pc": "0x00000001002e9fed", + "symbol": "v8::internal::Factory::NewFixedArrayWithFiller(v8::internal::RootIndex, int, v8::internal::Object, v8::internal::AllocationType) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100465fe4", + "symbol": "v8::internal::(anonymous namespace)::ElementsAccessorBase >::GrowCapacity(v8::internal::Handle, unsigned int) [/usr/local/bin/node]" + }, + { + "pc": "0x0000000100617f74", + "symbol": "v8::internal::Runtime_GrowArrayElements(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node]" + }, + { + "pc": "0x000000010097cc39", + "symbol": "Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/usr/local/bin/node]" + }, + { + "pc": "0x000030a2ba84a1cb", + "symbol": "" + } + ], + "javascriptHeap": { + "totalMemory": 2188333056, + "totalCommittedMemory": 2181726800, + "usedMemory": 2117666664, + "availableMemory": 43418392, + "memoryLimit": 2197815296, + "heapSpaces": { + "read_only_space": { + "memorySize": 262144, + "committedMemory": 33088, + "capacity": 32808, + "used": 32808, + "available": 0 + }, + "new_space": { + "memorySize": 33554432, + "committedMemory": 27553040, + "capacity": 16759296, + "used": 0, + "available": 16759296 + }, + "old_space": { + "memorySize": 1692803072, + "committedMemory": 1692699744, + "capacity": 1663396296, + "used": 1662978736, + "available": 417560 + }, + "code_space": { + "memorySize": 4886528, + "committedMemory": 4615808, + "capacity": 4232672, + "used": 4232672, + "available": 0 + }, + "map_space": { + "memorySize": 18616320, + "committedMemory": 18614560, + "capacity": 12850640, + "used": 12850640, + "available": 0 + }, + "large_object_space": { + "memorySize": 437264384, + "committedMemory": 437264384, + "capacity": 436717248, + "used": 436717248, + "available": 0 + }, + "code_large_object_space": { + "memorySize": 946176, + "committedMemory": 946176, + "capacity": 854560, + "used": 854560, + "available": 0 + }, + "new_large_object_space": { + "memorySize": 0, + "committedMemory": 0, + "capacity": 16759296, + "used": 0, + "available": 16759296 + } + } + }, + "resourceUsage": { + "userCpuSeconds": 536.786, + "kernelCpuSeconds": 44.9233, + "cpuConsumptionPercent": 28.8403, + "maxRss": 2575311044608, + "pageFaults": { + "IORequired": 246, + "IONotRequired": 8813567 + }, + "fsActivity": { + "reads": 0, + "writes": 0 + } + }, + "libuv": [ + ], + "workers": [ + ], + "environmentVariables": { + "GATSBY": "true", + "npm_config_save_dev": "", + "npm_config_legacy_bundling": "", + "npm_config_dry_run": "", + "npm_package_devDependencies_typedoc_plugin_markdown": "^2.2.11", + "npm_package_devDependencies_react_dom": "^16.13.1", + "npm_package_devDependencies_lint_staged": "^10.2.11", + "npm_package_devDependencies__turf_turf": "^5.1.6", + "npm_package_dependencies__antv_g_canvas": "^0.5.2", + "ELECTRON_MIRROR": "https://cdn.npm.taobao.org/dist/electron/", + "npm_config_only": "", + "npm_config_browser": "", + "npm_config_commit_hooks": "true", + "npm_config_viewer": "man", + "npm_package_gitHead": "6d40332622a05c0aff1ddb8c895850f380bf6c15", + "npm_package_devDependencies_prettier": "^2.0.5", + "npm_package_devDependencies_awesome_typescript_loader": "^5.2.1", + "npm_config_also": "", + "npm_package_devDependencies_jest_extended": "^0.11.2", + "npm_package_dependencies_ml_matrix": "^6.5.0", + "npm_package_dependencies_insert_css": "^2.0.0", + "npm_package_scripts_ci": "npm run build && npm run coverage", + "FLOW_BINARY_MIRROR": "https://github.com/facebook/flow/releases/download/v", + "npm_config_sign_git_commit": "", + "npm_config_rollback": "true", + "npm_package_dependencies__antv_hierarchy": "^0.6.2", + "npm_package_scripts_prettier": "prettier -c --write \"**/*\"", + "TERM_PROGRAM": "vscode", + "npm_config_usage": "", + "npm_config_audit": "true", + "npm_package_devDependencies_gatsby": "^2.24.40", + "ELECTRON_BUILDER_BINARIES_MIRROR": "https://npm.taobao.org/mirrors/electron-builder-binaries/", + "NODE": "/usr/local/bin/node", + "npm_package_devDependencies_typescript": "^3.5.3", + "npm_package_devDependencies__umijs_fabric": "^2.0.0", + "npm_package_scripts_site_clean": "gatsby clean", + "npm_package_homepage": "https://g6.antv.vision", + "INIT_CWD": "/Users/shiwu/Documents/GitHub/G6", + "npm_config_globalignorefile": "/usr/local/etc/npmignore", + "npm_package_devDependencies_jest": "^26.0.1", + "npm_package_dependencies__antv_g_math": "^0.1.1", + "TERM": "xterm-256color", + "SHELL": "/bin/bash", + "npm_config_init_author_url": "", + "npm_config_maxsockets": "50", + "npm_config_shell": "/bin/bash", + "npm_package_devDependencies_rimraf": "^3.0.0", + "npm_package_devDependencies_jest_electron": "^0.1.7", + "npm_config_parseable": "", + "npm_config_metrics_registry": "https://registry.npm.alibaba-inc.com/", + "npm_config_sharp_libvips_binary_host": "https://npm.taobao.org/mirrors/sharp-libvips", + "npm_config_shrinkwrap": "true", + "npm_package_devDependencies__storybook_addon_knobs": "^5.2.8", + "npm_package_dependencies__antv_g_webgpu": "^0.5.1", + "TMPDIR": "/var/folders/hr/y83tnpys531br0cbp1zy17rh0000gp/T/", + "npm_config_timing": "", + "npm_config_email": "", + "npm_config_init_license": "ISC", + "npm_package_scripts_lint": "eslint --ext .js,.jsx,.ts,.tsx --format=pretty \"./\"", + "npm_config_if_present": "", + "npm_package_devDependencies_jquery": "^3.5.1", + "TERM_PROGRAM_VERSION": "1.50.0", + "npm_package_devDependencies__antv_gatsby_theme_antv": "^1.0.2", + "npm_config_sign_git_tag": "", + "npm_config_init_author_email": "", + "npm_config_cache_max": "Infinity", + "npm_package_lint_staged_______less_md_json__0": "prettier --write", + "ORIGINAL_XDG_CURRENT_DESKTOP": "undefined", + "npm_config_preid": "", + "npm_config_long": "", + "npm_config_local_address": "", + "npm_config_cert": "", + "npm_config_git_tag_version": "true", + "npm_package_dependencies__antv_event_emitter": "~0.1.0", + "NWJS_URLBASE": "https://cdn.npm.taobao.org/dist/nwjs/v", + "npm_config_noproxy": "", + "npm_config___registry_npm_alibaba_inc_com__always_auth": "", + "npm_config_registry": "https://registry.npm.alibaba-inc.com/", + "npm_config_fetch_retries": "2", + "npm_package_dependencies__antv_g_svg": "^0.5.1", + "npm_package_repository_url": "git+https://github.com/antvis/g6.git", + "npm_config_versions": "", + "npm_config_key": "", + "npm_config_message": "%s", + "npm_package_readmeFilename": "README.md", + "NO_PROXY": "*", + "npm_package_devDependencies_webpack": "^4.41.4", + "npm_package_devDependencies_react_i18next": "^11.1.0", + "npm_package_devDependencies_react": "^16.13.1", + "npm_package_description": "A Graph Visualization Framework in JavaScript", + "USER": "shiwu", + "npm_package_devDependencies_webpack_cli": "^3.3.10", + "npm_package_dependencies_d3_force": "^2.0.1", + "npm_package_scripts_site_copy_mirror_action": "mkdir -p public/.github/workflows && cp .github/workflows/mirror.yml public/.github/workflows", + "npm_package_license": "MIT", + "npm_config_globalconfig": "/usr/local/etc/npmrc", + "npm_config_prefer_online": "", + "npm_config_always_auth": "", + "npm_config_logs_max": "10", + "npm_package_devDependencies__babel_core": "^7.7.7", + "npm_package_devDependencies_father": "^2.29.1", + "npm_package_devDependencies_babel_loader": "^8.0.6", + "npm_package_devDependencies__storybook_addon_actions": "^5.2.8", + "npm_package_dependencies__antv_util": "~2.0.5", + "SSH_AUTH_SOCK": "/private/tmp/com.apple.launchd.FG3rp6joEV/Listeners", + "npm_package_devDependencies_eslint": "^7.7.0", + "npm_package_devDependencies__types_jest": "^25.2.1", + "npm_package_scripts_test_live": "DEBUG_MODE=1 jest --watch ./tests/unit/graph/graph-watermarker-spec.ts", + "__CF_USER_TEXT_ENCODING": "0x1F6:0x0:0x0", + "npm_execpath": "/usr/local/lib/node_modules/npm/bin/npm-cli.js", + "npm_config_global_style": "", + "npm_config_cache_lock_retries": "10", + "npm_package_devDependencies__typescript_eslint_eslint_plugin": "^3.9.0", + "npm_package_husky_hooks_pre_commit": "lint-staged", + "npm_package_scripts_coverage": "jest --coverage", + "npm_config_cafile": "", + "npm_config_update_notifier": "true", + "npm_package_module": "es/index.js", + "npm_package_author_name": "https://github.com/orgs/antvis/people", + "npm_config_audit_level": "low", + "npm_config_heading": "npm", + "npm_config_read_only": "", + "npm_config_offline": "", + "npm_config_fetch_retry_mintimeout": "10000", + "npm_config_searchlimit": "20", + "npm_package_scripts_lint_staged_js": "eslint --ext .js,.jsx,.ts,.tsx", + "npm_package_scripts_doc": "rimraf apis && typedoc", + "npm_config_json": "", + "npm_config_access": "", + "npm_config_argv": "{\"remain\":[],\"cooked\":[\"run\",\"site:develop\"],\"original\":[\"run\",\"site:develop\"]}", + "PATH": "/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/shiwu/Documents/GitHub/G6/node_modules/.bin:/usr/local/lib/node_modules/tnpm/node_modules/_npm@6.14.9@npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/shiwu/Documents/GitHub/G6/node_modules/.bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/sbin:/opt/X11/bin:/Library/Apple/usr/bin:/Users/shiwu/torch/install/bin:/Users/shiwu/torch/install/bin", + "npm_config_allow_same_version": "", + "npm_config___registry_npm_alibaba_inc_com__username": "shiwu.wyy", + "npm_package_devDependencies_typedoc": "^0.17.6", + "npm_config_https_proxy": "", + "npm_config_engine_strict": "", + "npm_config_description": "true", + "_": "/Users/shiwu/Documents/GitHub/G6/node_modules/.bin/gatsby", + "npm_config_userconfig": "/Users/shiwu/.tnpmrc", + "npm_config_init_module": "/Users/shiwu/.npm-init.js", + "npm_package_devDependencies_ts_jest": "^24.1.0", + "npm_package_keywords_4": "graph editor", + "NVM_NODEJS_ORG_MIRROR": "https://cdn.npm.taobao.org/dist/node", + "npm_config_cidr": "", + "npm_package_keywords_5": "graph visualization", + "PWD": "/Users/shiwu/Documents/GitHub/G6", + "npm_config_user": "", + "npm_config_node_version": "12.16.3", + "npm_package_bugs_url": "https://github.com/antvis/g6/issues", + "npm_package_keywords_6": "relational data", + "PUPPETEER_DOWNLOAD_HOST": "https://cdn.npm.taobao.org/dist", + "npm_lifecycle_event": "site:develop", + "CHROMEDRIVER_CDNURL": "https://cdn.npm.taobao.org/dist/chromedriver", + "npm_config_ignore_prepublish": "", + "npm_config_auth_type": "legacy", + "npm_config_editor": "vi", + "npm_config_save": "true", + "npm_package_types": "lib/index.d.ts", + "npm_package_repository_type": "git", + "npm_package_keywords_0": "antv", + "npm_package_name": "@antv/g6", + "NO_UPDATE_NOTIFIER": "true", + "LANG": "en_US.UTF-8", + "npm_config_script_shell": "", + "npm_config_tag": "latest", + "npm_package_devDependencies__babel_preset_react": "^7.7.4", + "npm_package_scripts_site_develop": "GATSBY=true gatsby develop --open", + "npm_package_keywords_1": "g6", + "npm_config_global": "", + "npm_config_before": "", + "npm_config_progress": "true", + "npm_package_dependencies__antv_path_util": "^2.0.3", + "npm_package_scripts_start": "npm run site:develop", + "npm_package_scripts_build": "npm run clean && father build && npm run build:umd", + "npm_package_keywords_2": "graph", + "npm_config_ham_it_up": "", + "npm_config_optional": "true", + "npm_config_searchstaleness": "900", + "npm_package_devDependencies_ts_loader": "^7.0.3", + "npm_package_dependencies__ant_design_colors": "^4.0.5", + "npm_package_keywords_3": "graph analysis", + "XPC_FLAGS": "0x0", + "npm_config_save_prod": "", + "npm_config_force": "", + "npm_config_bin_links": "true", + "SENTRYCLI_CDNURL": "https://cdn.npm.taobao.org/dist/sentry-cli", + "npm_config_searchopts": "", + "npm_package_devDependencies_pre_commit": "^1.2.2", + "npm_package_devDependencies__storybook_react": "^5.2.8", + "npm_package_devDependencies__storybook_addon_info": "^5.2.8", + "npm_config_depth": "Infinity", + "npm_config_node_gyp": "/usr/local/lib/node_modules/tnpm/node_modules/_npm@6.14.9@npm/node_modules/node-gyp/bin/node-gyp.js", + "npm_package_main": "lib/index.js", + "npm_config_rebuild_bundle": "true", + "npm_config_sso_poll_frequency": "500", + "npm_package_scripts_watch": "father build -w", + "npm_package_version": "4.0.3", + "XPC_SERVICE_NAME": "0", + "npm_config_unicode": "true", + "npm_package_devDependencies_worker_loader": "^3.0.0", + "npm_package_devDependencies__antv_chart_node_g6": "^0.0.3", + "yarn_registry": "https://registry.npm.alibaba-inc.com", + "SHLVL": "4", + "HOME": "/Users/shiwu", + "npm_config_fetch_retry_maxtimeout": "60000", + "npm_package_scripts_test": "jest", + "npm_package_scripts_site_build": "npm run site:clean && GATSBY=true gatsby build --prefix-paths", + "VSCODE_GIT_ASKPASS_MAIN": "/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/git/dist/askpass-main.js", + "npm_config_ca": "", + "npm_config_loglevel": "notice", + "npm_config_save_prefix": "^", + "npm_config_scripts_prepend_node_path": "warn-only", + "npm_config_sso_type": "oauth", + "npm_config_strict_ssl": "true", + "npm_config_tag_version_prefix": "v", + "npm_package_devDependencies__antv_g_webgpu_compiler": "^0.5.1", + "npm_config_save_exact": "", + "npm_config_dev": "", + "npm_config_fetch_retry_factor": "10", + "npm_config_group": "20", + "npm_package_devDependencies_husky": "^4.2.5", + "npm_package_dependencies_dagre": "^0.8.5", + "SASS_BINARY_SITE": "https://cdn.npm.taobao.org/dist/node-sass", + "npm_config_version": "", + "npm_config_prefer_offline": "", + "npm_config_robotjs_binary_host": "https://cdn.npm.taobao.org/dist/robotjs", + "npm_config_cache_lock_stale": "60000", + "npm_package_devDependencies_event_simulate": "~1.0.0", + "npm_package_dependencies__antv_dom_util": "^2.0.1", + "PHANTOMJS_CDNURL": "https://cdn.npm.taobao.org/dist/phantomjs", + "npm_config_otp": "", + "npm_config_disturl": "https://tnpm-hz.oss-cn-hangzhou.aliyuncs.com/dist/node", + "npm_config_cache_min": "10", + "OPERADRIVER_CDNURL": "https://cdn.npm.taobao.org/dist/operadriver", + "npm_config_searchexclude": "", + "npm_config_cache": "/Users/shiwu/.tnpm", + "npm_package_scripts_cdn": "antv-bin upload -n @antv/g6", + "LOGNAME": "shiwu", + "npm_lifecycle_script": "GATSBY=true gatsby develop --open", + "npm_config_color": "true", + "npm_package_devDependencies_gh_pages": "^2.1.1", + "NODEJS_ORG_MIRROR": "https://cdn.npm.taobao.org/dist/node", + "npm_config_proxy": "", + "npm_config_package_lock": "true", + "npm_package_devDependencies__babel_plugin_proposal_class_properties": "^7.1.0", + "npm_package_scripts_build_umd": "webpack --config webpack.config.js --mode production", + "VSCODE_GIT_IPC_HANDLE": "/var/folders/hr/y83tnpys531br0cbp1zy17rh0000gp/T/vscode-git-3cac888e60.sock", + "npm_config_package_lock_only": "", + "npm_config_fund": "true", + "npm_config_save_optional": "", + "npm_package_browser": "dist/g6.min.js", + "npm_config_ignore_scripts": "", + "npm_config_user_agent": "npm/6.14.9 node/v12.16.3 darwin x64", + "npm_package_dependencies__antv_matrix_util": "^2.0.4", + "npm_package_files_3": "dist", + "NVM_IOJS_ORG_MIRROR": "https://cdn.npm.taobao.org/dist/iojs", + "npm_config_cache_lock_wait": "10000", + "npm_package_devDependencies__types_node": "13.11.1", + "npm_package_files_2": "lib", + "VSCODE_GIT_ASKPASS_NODE": "/Applications/Visual Studio Code.app/Contents/Frameworks/Code Helper (Renderer).app/Contents/MacOS/Code Helper (Renderer)", + "GIT_ASKPASS": "/Applications/Visual Studio Code.app/Contents/Resources/app/extensions/git/dist/askpass.sh", + "npm_config_production": "", + "npm_package_dependencies_color": "^3.1.3", + "npm_package_files_1": "es", + "DISPLAY": "/private/tmp/com.apple.launchd.dKUhETO8RE/org.macosforge.xquartz:0", + "npm_config_send_metrics": "", + "npm_config_save_bundle": "", + "npm_package_dependencies__antv_g_base": "^0.5.1", + "npm_package_scripts_site_deploy": "npm run site:build && npm run site:copy-mirror-action && gh-pages -d public", + "npm_package_files_0": "package.json", + "SWC_BINARY_SITE": "https://cdn.npm.taobao.org/dist/node-swc", + "npm_config_node_options": "", + "npm_config_sharp_binary_host": "https://cdn.npm.taobao.org/dist/sharp", + "npm_config_init_version": "1.0.0", + "npm_config_umask": "0022", + "npm_package_dependencies__antv_scale": "^0.3.1", + "npm_package_lint_staged_______js_jsx_ts_tsx__1": "prettier --write", + "npm_config_init_author_name": "", + "npm_config_git": "git", + "npm_config_scope": "", + "npm_package_lint_staged_______js_jsx_ts_tsx__0": "npm run lint-staged:js", + "npm_package_scripts_clean": "rimraf es esm lib dist", + "npm_config_onload_script": "", + "npm_config___registry_npm_alibaba_inc_com__email": "shiwu.wyy@antgroup.com", + "npm_config_tmp": "/Users/shiwu/.tnpm_tmp", + "npm_config_unsafe_perm": "true", + "npm_package_scripts_lint_src": "eslint --ext .ts --format=pretty \"./src\"", + "npm_package_scripts_demos": "start-storybook -p 8080 -c .storybook", + "npm_package_files_5": "README.md", + "npm_node_execpath": "/usr/local/bin/node", + "npm_config_link": "", + "npm_config_prefix": "/usr/local", + "npm_config_format_package_lock": "true", + "npm_package_files_4": "LICENSE", + "COLORTERM": "truecolor", + "GATSBY_LOGGER": "yurnalist", + "gatsby_log_level": "normal", + "gatsby_executing_command": "develop", + "NODE_ENV": "development", + "VIPSHOME": "/Users/runner/work/sharp-libvips/sharp-libvips/target", + "GATSBY_BUILD_STAGE": "develop" + }, + "userLimits": { + "core_file_size_blocks": { + "soft": 0, + "hard": "unlimited" + }, + "data_seg_size_kbytes": { + "soft": "unlimited", + "hard": "unlimited" + }, + "file_size_blocks": { + "soft": "unlimited", + "hard": "unlimited" + }, + "max_locked_memory_bytes": { + "soft": "unlimited", + "hard": "unlimited" + }, + "max_memory_size_kbytes": { + "soft": "unlimited", + "hard": "unlimited" + }, + "open_files": { + "soft": 24576, + "hard": "unlimited" + }, + "stack_size_bytes": { + "soft": 8388608, + "hard": 67104768 + }, + "cpu_time_seconds": { + "soft": "unlimited", + "hard": "unlimited" + }, + "max_user_processes": { + "soft": 2784, + "hard": 4176 + }, + "virtual_memory_kbytes": { + "soft": "unlimited", + "hard": "unlimited" + } + }, + "sharedObjects": [ + "/usr/local/bin/node", + "/System/Library/Frameworks/CoreFoundation.framework/Versions/A/CoreFoundation", + "/usr/lib/libSystem.B.dylib", + "/usr/lib/libc++.1.dylib", + "/usr/lib/libobjc.A.dylib", + "/usr/lib/libfakelink.dylib", + "/usr/lib/libDiagnosticMessagesClient.dylib", + "/usr/lib/libicucore.A.dylib", + "/usr/lib/libz.1.dylib", + "/usr/lib/libc++abi.dylib", + "/usr/lib/system/libcache.dylib", + "/usr/lib/system/libcommonCrypto.dylib", + "/usr/lib/system/libcompiler_rt.dylib", + "/usr/lib/system/libcopyfile.dylib", + "/usr/lib/system/libcorecrypto.dylib", + "/usr/lib/system/libdispatch.dylib", + "/usr/lib/system/libdyld.dylib", + "/usr/lib/system/libkeymgr.dylib", + "/usr/lib/system/liblaunch.dylib", + "/usr/lib/system/libmacho.dylib", + "/usr/lib/system/libquarantine.dylib", + "/usr/lib/system/libremovefile.dylib", + "/usr/lib/system/libsystem_asl.dylib", + "/usr/lib/system/libsystem_blocks.dylib", + "/usr/lib/system/libsystem_c.dylib", + "/usr/lib/system/libsystem_configuration.dylib", + "/usr/lib/system/libsystem_coreservices.dylib", + "/usr/lib/system/libsystem_darwin.dylib", + "/usr/lib/system/libsystem_dnssd.dylib", + "/usr/lib/system/libsystem_featureflags.dylib", + "/usr/lib/system/libsystem_info.dylib", + "/usr/lib/system/libsystem_m.dylib", + "/usr/lib/system/libsystem_malloc.dylib", + "/usr/lib/system/libsystem_networkextension.dylib", + "/usr/lib/system/libsystem_notify.dylib", + "/usr/lib/system/libsystem_sandbox.dylib", + "/usr/lib/system/libsystem_secinit.dylib", + "/usr/lib/system/libsystem_kernel.dylib", + "/usr/lib/system/libsystem_platform.dylib", + "/usr/lib/system/libsystem_pthread.dylib", + "/usr/lib/system/libsystem_symptoms.dylib", + "/usr/lib/system/libsystem_trace.dylib", + "/usr/lib/system/libunwind.dylib", + "/usr/lib/system/libxpc.dylib", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_fsevents@2.1.3@fsevents/fsevents.node", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/CoreServices", + "/System/Library/Frameworks/CFNetwork.framework/Versions/A/CFNetwork", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/FSEvents.framework/Versions/A/FSEvents", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/CarbonCore.framework/Versions/A/CarbonCore", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/Metadata.framework/Versions/A/Metadata", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/OSServices.framework/Versions/A/OSServices", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/SearchKit.framework/Versions/A/SearchKit", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/AE.framework/Versions/A/AE", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/LaunchServices.framework/Versions/A/LaunchServices", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/DictionaryServices.framework/Versions/A/DictionaryServices", + "/System/Library/Frameworks/CoreServices.framework/Versions/A/Frameworks/SharedFileList.framework/Versions/A/SharedFileList", + "/System/Library/Frameworks/Foundation.framework/Versions/C/Foundation", + "/System/Library/Frameworks/IOKit.framework/Versions/A/IOKit", + "/System/Library/Frameworks/SystemConfiguration.framework/Versions/A/SystemConfiguration", + "/System/Library/Frameworks/Security.framework/Versions/A/Security", + "/usr/lib/libsqlite3.dylib", + "/usr/lib/libxml2.2.dylib", + "/usr/lib/libnetwork.dylib", + "/usr/lib/libapple_nghttp2.dylib", + "/usr/lib/libauto.dylib", + "/usr/lib/libcompression.dylib", + "/System/Library/Frameworks/DiskArbitration.framework/Versions/A/DiskArbitration", + "/usr/lib/libarchive.2.dylib", + "/usr/lib/liblangid.dylib", + "/usr/lib/libCRFSuite.dylib", + "/usr/lib/liblzma.5.dylib", + "/usr/lib/libenergytrace.dylib", + "/usr/lib/libbsm.0.dylib", + "/usr/lib/system/libkxld.dylib", + "/System/Library/PrivateFrameworks/AppleFSCompression.framework/Versions/A/AppleFSCompression", + "/usr/lib/libcoretls.dylib", + "/usr/lib/libcoretls_cfhelpers.dylib", + "/usr/lib/libpam.2.dylib", + "/usr/lib/libxar.1.dylib", + "/usr/lib/libbz2.1.0.dylib", + "/usr/lib/libiconv.2.dylib", + "/usr/lib/libcharset.1.dylib", + "/usr/lib/libpcap.A.dylib", + "/System/Library/Frameworks/NetFS.framework/Versions/A/NetFS", + "/System/Library/PrivateFrameworks/NetAuth.framework/Versions/A/NetAuth", + "/System/Library/PrivateFrameworks/login.framework/Versions/A/Frameworks/loginsupport.framework/Versions/A/loginsupport", + "/System/Library/PrivateFrameworks/TCC.framework/Versions/A/TCC", + "/System/Library/PrivateFrameworks/CoreNLP.framework/Versions/A/CoreNLP", + "/System/Library/PrivateFrameworks/MetadataUtilities.framework/Versions/A/MetadataUtilities", + "/usr/lib/libmecabra.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Accelerate", + "/usr/lib/libmecab.dylib", + "/usr/lib/libgermantok.dylib", + "/usr/lib/libThaiTokenizer.dylib", + "/usr/lib/libChineseTokenizer.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vImage.framework/Versions/A/vImage", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/vecLib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libvMisc.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libvDSP.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libLAPACK.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libLinearAlgebra.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libSparseBLAS.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libQuadrature.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBNNS.dylib", + "/System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libSparse.dylib", + "/System/Library/PrivateFrameworks/LanguageModeling.framework/Versions/A/LanguageModeling", + "/System/Library/PrivateFrameworks/CoreEmoji.framework/Versions/A/CoreEmoji", + "/System/Library/PrivateFrameworks/LinguisticData.framework/Versions/A/LinguisticData", + "/System/Library/PrivateFrameworks/Lexicon.framework/Versions/A/Lexicon", + "/usr/lib/libcmph.dylib", + "/System/Library/Frameworks/OpenDirectory.framework/Versions/A/Frameworks/CFOpenDirectory.framework/Versions/A/CFOpenDirectory", + "/System/Library/Frameworks/OpenDirectory.framework/Versions/A/OpenDirectory", + "/System/Library/PrivateFrameworks/APFS.framework/Versions/A/APFS", + "/System/Library/Frameworks/SecurityFoundation.framework/Versions/A/SecurityFoundation", + "/usr/lib/libutil.dylib", + "/System/Library/PrivateFrameworks/CoreServicesStore.framework/Versions/A/CoreServicesStore", + "/System/Library/Frameworks/ServiceManagement.framework/Versions/A/ServiceManagement", + "/System/Library/PrivateFrameworks/BackgroundTaskManagement.framework/Versions/A/BackgroundTaskManagement", + "/usr/lib/libxslt.1.dylib", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_sharp@0.26.3@sharp/build/Release/sharp.node", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_sharp@0.26.3@sharp/vendor/8.10.0/lib/libvips-cpp.42.dylib", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_sharp@0.26.3@sharp/vendor/8.10.0/lib/libvips.42.dylib", + "/System/Library/Frameworks/AppKit.framework/Versions/C/AppKit", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/ApplicationServices", + "/usr/lib/libresolv.9.dylib", + "/System/Library/PrivateFrameworks/UIFoundation.framework/Versions/A/UIFoundation", + "/System/Library/PrivateFrameworks/RemoteViewServices.framework/Versions/A/RemoteViewServices", + "/System/Library/PrivateFrameworks/XCTTargetBootstrap.framework/Versions/A/XCTTargetBootstrap", + "/System/Library/Frameworks/CoreDisplay.framework/Versions/A/CoreDisplay", + "/System/Library/Frameworks/Metal.framework/Versions/A/Metal", + "/System/Library/PrivateFrameworks/DesktopServicesPriv.framework/Versions/A/DesktopServicesPriv", + "/System/Library/PrivateFrameworks/CoreSVG.framework/Versions/A/CoreSVG", + "/System/Library/PrivateFrameworks/SkyLight.framework/Versions/A/SkyLight", + "/System/Library/Frameworks/CoreGraphics.framework/Versions/A/CoreGraphics", + "/System/Library/PrivateFrameworks/IconServices.framework/Versions/A/IconServices", + "/System/Library/Frameworks/IOSurface.framework/Versions/A/IOSurface", + "/System/Library/PrivateFrameworks/DFRFoundation.framework/Versions/A/DFRFoundation", + "/System/Library/Frameworks/AudioToolbox.framework/Versions/A/AudioToolbox", + "/System/Library/Frameworks/AudioUnit.framework/Versions/A/AudioUnit", + "/System/Library/Frameworks/CoreData.framework/Versions/A/CoreData", + "/System/Library/PrivateFrameworks/DataDetectorsCore.framework/Versions/A/DataDetectorsCore", + "/System/Library/Frameworks/Carbon.framework/Versions/A/Frameworks/HIToolbox.framework/Versions/A/HIToolbox", + "/System/Library/Frameworks/QuartzCore.framework/Versions/A/QuartzCore", + "/System/Library/Frameworks/Carbon.framework/Versions/A/Frameworks/SpeechRecognition.framework/Versions/A/SpeechRecognition", + "/System/Library/PrivateFrameworks/CoreUI.framework/Versions/A/CoreUI", + "/System/Library/Frameworks/CoreAudio.framework/Versions/A/CoreAudio", + "/System/Library/PrivateFrameworks/MultitouchSupport.framework/Versions/A/MultitouchSupport", + "/System/Library/PrivateFrameworks/PerformanceAnalysis.framework/Versions/A/PerformanceAnalysis", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/OpenGL", + "/System/Library/Frameworks/ColorSync.framework/Versions/A/ColorSync", + "/System/Library/Frameworks/CoreImage.framework/Versions/A/CoreImage", + "/System/Library/Frameworks/CoreText.framework/Versions/A/CoreText", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/ImageIO", + "/usr/lib/libMobileGestalt.dylib", + "/System/Library/PrivateFrameworks/TextureIO.framework/Versions/A/TextureIO", + "/usr/lib/libate.dylib", + "/System/Library/PrivateFrameworks/InternationalSupport.framework/Versions/A/InternationalSupport", + "/System/Library/PrivateFrameworks/AppleSystemInfo.framework/Versions/A/AppleSystemInfo", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libJPEG.dylib", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libTIFF.dylib", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libPng.dylib", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libGIF.dylib", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libJP2.dylib", + "/System/Library/Frameworks/ImageIO.framework/Versions/A/Resources/libRadiance.dylib", + "/usr/lib/libexpat.1.dylib", + "/System/Library/PrivateFrameworks/AppleJPEG.framework/Versions/A/AppleJPEG", + "/System/Library/PrivateFrameworks/FontServices.framework/libFontParser.dylib", + "/System/Library/PrivateFrameworks/WatchdogClient.framework/Versions/A/WatchdogClient", + "/System/Library/PrivateFrameworks/IOAccelerator.framework/Versions/A/IOAccelerator", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Versions/A/MetalPerformanceShaders", + "/System/Library/PrivateFrameworks/GPUWrangler.framework/Versions/A/GPUWrangler", + "/System/Library/PrivateFrameworks/IOPresentment.framework/Versions/A/IOPresentment", + "/System/Library/PrivateFrameworks/DSExternalDisplay.framework/Versions/A/DSExternalDisplay", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libCoreFSCache.dylib", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSCore.framework/Versions/A/MPSCore", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSImage.framework/Versions/A/MPSImage", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSNeuralNetwork.framework/Versions/A/MPSNeuralNetwork", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSMatrix.framework/Versions/A/MPSMatrix", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSRayIntersector.framework/Versions/A/MPSRayIntersector", + "/System/Library/Frameworks/MetalPerformanceShaders.framework/Frameworks/MPSNDArray.framework/Versions/A/MPSNDArray", + "/System/Library/PrivateFrameworks/MetalTools.framework/Versions/A/MetalTools", + "/System/Library/PrivateFrameworks/AggregateDictionary.framework/Versions/A/AggregateDictionary", + "/System/Library/PrivateFrameworks/CoreAnalytics.framework/Versions/A/CoreAnalytics", + "/System/Library/PrivateFrameworks/AppleSauce.framework/Versions/A/AppleSauce", + "/usr/lib/libIOReport.dylib", + "/System/Library/Frameworks/CoreVideo.framework/Versions/A/CoreVideo", + "/System/Library/PrivateFrameworks/GraphVisualizer.framework/Versions/A/GraphVisualizer", + "/System/Library/PrivateFrameworks/FaceCore.framework/Versions/A/FaceCore", + "/System/Library/Frameworks/OpenCL.framework/Versions/A/OpenCL", + "/usr/lib/libFosl_dynamic.dylib", + "/System/Library/PrivateFrameworks/OTSVG.framework/Versions/A/OTSVG", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/ATS.framework/Versions/A/Resources/libFontRegistry.dylib", + "/System/Library/PrivateFrameworks/FontServices.framework/libhvf.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libGFXShared.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libGLU.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libGL.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libGLImage.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libCVMSPluginSupport.dylib", + "/System/Library/Frameworks/OpenGL.framework/Versions/A/Libraries/libCoreVMClient.dylib", + "/usr/lib/libncurses.5.4.dylib", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/ATS.framework/Versions/A/ATS", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/ColorSyncLegacy.framework/Versions/A/ColorSyncLegacy", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/HIServices.framework/Versions/A/HIServices", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/LangAnalysis.framework/Versions/A/LangAnalysis", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/PrintCore.framework/Versions/A/PrintCore", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/QD.framework/Versions/A/QD", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/SpeechSynthesis.framework/Versions/A/SpeechSynthesis", + "/System/Library/Frameworks/ApplicationServices.framework/Versions/A/Frameworks/ATSUI.framework/Versions/A/ATSUI", + "/usr/lib/libcups.2.dylib", + "/System/Library/Frameworks/Kerberos.framework/Versions/A/Kerberos", + "/System/Library/Frameworks/GSS.framework/Versions/A/GSS", + "/System/Library/PrivateFrameworks/Heimdal.framework/Versions/A/Heimdal", + "/System/Library/Frameworks/Kerberos.framework/Versions/A/Libraries/libHeimdalProxy.dylib", + "/usr/lib/libheimdal-asn1.dylib", + "/System/Library/PrivateFrameworks/CommonAuth.framework/Versions/A/CommonAuth", + "/System/Library/PrivateFrameworks/AssertionServices.framework/Versions/A/AssertionServices", + "/System/Library/PrivateFrameworks/AudioToolboxCore.framework/Versions/A/AudioToolboxCore", + "/System/Library/PrivateFrameworks/caulk.framework/Versions/A/caulk", + "/System/Library/PrivateFrameworks/BaseBoard.framework/Versions/A/BaseBoard", + "/System/Library/PrivateFrameworks/RunningBoardServices.framework/Versions/A/RunningBoardServices", + "/System/Library/PrivateFrameworks/PersistentConnection.framework/Versions/A/PersistentConnection", + "/System/Library/PrivateFrameworks/ProtocolBuffer.framework/Versions/A/ProtocolBuffer", + "/System/Library/PrivateFrameworks/CommonUtilities.framework/Versions/A/CommonUtilities", + "/System/Library/PrivateFrameworks/Bom.framework/Versions/A/Bom", + "/usr/lib/libAudioToolboxUtility.dylib", + "/System/Library/PrivateFrameworks/Backup.framework/Versions/A/Backup", + "/System/Library/PrivateFrameworks/CrashReporterSupport.framework/Versions/A/CrashReporterSupport", + "/System/Library/PrivateFrameworks/Sharing.framework/Versions/A/Sharing", + "/System/Library/PrivateFrameworks/Apple80211.framework/Versions/A/Apple80211", + "/System/Library/PrivateFrameworks/AuthKit.framework/Versions/A/AuthKit", + "/System/Library/PrivateFrameworks/CoreUtils.framework/Versions/A/CoreUtils", + "/System/Library/Frameworks/CoreWLAN.framework/Versions/A/CoreWLAN", + "/System/Library/Frameworks/IOBluetooth.framework/Versions/A/IOBluetooth", + "/System/Library/PrivateFrameworks/MobileKeyBag.framework/Versions/A/MobileKeyBag", + "/System/Library/PrivateFrameworks/CorePhoneNumbers.framework/Versions/A/CorePhoneNumbers", + "/System/Library/PrivateFrameworks/AppleIDAuthSupport.framework/Versions/A/AppleIDAuthSupport", + "/System/Library/Frameworks/Network.framework/Versions/A/Network", + "/System/Library/PrivateFrameworks/KeychainCircle.framework/Versions/A/KeychainCircle", + "/System/Library/Frameworks/CoreBluetooth.framework/Versions/A/CoreBluetooth", + "/System/Library/PrivateFrameworks/SpeechRecognitionCore.framework/Versions/A/SpeechRecognitionCore", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_bufferutil@4.0.2@bufferutil/prebuilds/darwin-x64/node.napi.node", + "/Users/shiwu/Documents/GitHub/G6/node_modules/_utf-8-validate@5.0.3@utf-8-validate/prebuilds/darwin-x64/node.napi.node" + ] +} \ No newline at end of file diff --git a/src/global.ts b/src/global.ts index 8680839561f..0684773041e 100644 --- a/src/global.ts +++ b/src/global.ts @@ -7,7 +7,7 @@ const textColor = 'rgb(0, 0, 0)'; const colorSet = getColorsWithSubjectColor(subjectColor, backColor); export default { - version: '4.0.2', + version: '4.0.3', rootContainerClassName: 'root-container', nodeContainerClassName: 'node-container', edgeContainerClassName: 'edge-container', diff --git a/src/interface/item.ts b/src/interface/item.ts index 742badc2ded..7387e05d543 100644 --- a/src/interface/item.ts +++ b/src/interface/item.ts @@ -87,7 +87,7 @@ export interface IItemBase { isItem(): boolean; - getShapeStyleByName(name?: string): ShapeStyle | void; + getShapeStyleByName(name?: string): ShapeStyle; /** * 获取当前元素的所有状态 diff --git a/src/item/item.ts b/src/item/item.ts index bd0f84e58e1..99a6b382d2b 100644 --- a/src/item/item.ts +++ b/src/item/item.ts @@ -31,6 +31,7 @@ import Global from '../global'; const CACHE_BBOX = 'bboxCache'; const CACHE_CANVAS_BBOX = 'bboxCanvasCache'; +const ARROWS = ['startArrow', 'endArrow']; export default class ItemBase implements IItemBase { public _cfg: IItemBaseConfig & { @@ -215,34 +216,66 @@ export default class ItemBase implements IItemBase { const self = this; const keyShapeName = keyShape.get('name'); - each(children, (child) => { - const name = child.get('name'); - if (name && name !== keyShapeName) { - originStyles[name] = self.getShapeStyleByName(name); - } - }); + if (!this.get('originStyle')) { + each(children, (child) => { + const name = child.get('name'); + if (name && name !== keyShapeName) { + originStyles[name] = self.getShapeStyleByName(name); + } else { + const keyShapeStyle: ShapeStyle = self.getShapeStyleByName(); + if (keyShapeStyle.path) delete keyShapeStyle.path; + if (keyShapeStyle.matrix) delete keyShapeStyle.matrix; + if (!keyShapeName) { + Object.assign(originStyles, keyShapeStyle); + } else { + originStyles[keyShapeName] = keyShapeStyle; + } + } + }); + } + const itemType = this.get('type'); const model = this.getModel(); - const shapeFactory = Shape.getFactory(this.get('type')); - const shapeOptions = shapeFactory.getShape().getOptions(model); - const defaultStyle = shapeOptions.style; + let shapeType = model.type; + if (!shapeType) { + switch (itemType) { + case 'edge': + shapeType = 'line'; + break; + default: + shapeType = 'circle'; + break; + } + } + + let shapeFactory = Shape.getFactory(itemType)[shapeType]; + if (!shapeFactory) shapeFactory = Shape.getFactory(itemType).getShape(); + const shapeOptions = shapeFactory.getOptions ? shapeFactory.getOptions(model) : {}; + const defaultStyle = shapeOptions.style || {}; const size = shapeOptions.size; - const itemType = this.get('type'); if (itemType === 'edge') { if (!defaultStyle.lineWidth) defaultStyle.lineWidth = size || Global.defaultEdge.size; - } else if (itemType === 'node') { + } else { if (!defaultStyle.r) defaultStyle.r = size / 2 || Global.defaultNode.size / 2; - if (!defaultStyle.width) defaultStyle.r = (isArray(size) ? size[0] : size) || Global.defaultNode.size / 2; - if (!defaultStyle.height) defaultStyle.r = (isArray(size) ? size[1] : size) || Global.defaultNode.size / 2; + if (!defaultStyle.width) defaultStyle.width = (isArray(size) ? size[0] : size) || Global.defaultNode.size / 2; + if (!defaultStyle.height) defaultStyle.height = (isArray(size) ? size[1] : size) || Global.defaultNode.size / 2; } if (!keyShapeName) { Object.assign(originStyles, defaultStyle); } else { - originStyles[keyShapeName] = defaultStyle; + const styles: ShapeStyle = {}; + for (const key in defaultStyle) { + const style = defaultStyle[key]; + if (!isPlainObject(style) || ARROWS.includes(key)) styles[key] = style; + } + if (styles.path) delete styles.path; + if (styles.matrix) delete styles.matrix; + if (!originStyles[keyShapeName]) originStyles[keyShapeName] = styles; + else originStyles[keyShapeName] = Object.assign(styles, originStyles[keyShapeName]); } const drawOriginStyle = this.getOriginStyle(); - let styles = {}; + let styles: ShapeStyle = {}; if (cfg) { styles = deepMix({}, drawOriginStyle, originStyles, cfg.style, { labelCfg: cfg.labelCfg, @@ -251,6 +284,8 @@ export default class ItemBase implements IItemBase { styles = deepMix({}, drawOriginStyle, originStyles); } + if (styles.path) delete styles.path; + if (styles.matrix) delete styles.matrix; self.set('originStyle', styles); } @@ -332,7 +367,7 @@ export default class ItemBase implements IItemBase { this.afterDraw(); } - public getShapeStyleByName(name?: string): ShapeStyle | void { + public getShapeStyleByName(name?: string): ShapeStyle { const group: Group = this.get('group'); let currentShape: IShapeBase = this.getKeyShape(); diff --git a/src/shape/shapeBase.ts b/src/shape/shapeBase.ts index 3b19ea332d1..91eb10c949a 100644 --- a/src/shape/shapeBase.ts +++ b/src/shape/shapeBase.ts @@ -8,11 +8,49 @@ import { ShapeOptions, ILabelConfig } from '../interface/shape'; import { IPoint, Item, LabelStyle, ShapeStyle, ModelConfig, EdgeConfig } from '../types'; import Global from '../global'; import { transform } from '@antv/matrix-util'; -import { deepMix, each, mix, isBoolean, isPlainObject, clone } from '@antv/util'; +import { deepMix, each, mix, isBoolean, isPlainObject, clone, isString } from '@antv/util'; const CLS_SHAPE_SUFFIX = '-shape'; const CLS_LABEL_SUFFIX = '-label'; const ARROWS = ['startArrow', 'endArrow']; +const SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: undefined, + fill: undefined, + lineAppendWidth: 1, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + x: 0, + y: 0, + r: 10, + width: 20, + height: 20, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0 +} +const PATH_SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: '#000', + lineDash: undefined, + startArrow: false, + endArrow: false, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0 +} +const SHAPES_DEFAULT_ATTRS = { + edge: PATH_SHAPE_DEFAULT_ATTRS, + node: SHAPE_DEFAULT_ATTRS, + combo: SHAPE_DEFAULT_ATTRS +} + export const CLS_LABEL_BG_SUFFIX = '-label-bg'; // 单个 shape 带有一个 label，共用这段代码 @@ -317,6 +355,9 @@ export const shapeBase: ShapeOptions = { const group = item.getContainer(); + // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值。使用对象检索更快 + const keptAttrs = { x: 1, y: 1, cx: 1, cy: 1 }; + if (value) { // style 为要设置的状态的样式 for (const key in styles) { @@ -339,6 +380,7 @@ export const shapeBase: ShapeOptions = { const model = item.getModel(); // 原始样式 + const tmp = item.getOriginStyle(); const originStyle = mix({}, model.style, clone(item.getOriginStyle())); const keyShapeName = shape.get('name'); @@ -353,20 +395,25 @@ export const shapeBase: ShapeOptions = { if (isPlainObject(style) && !ARROWS.includes(p)) { const subShape = group.find((element) => element.get('name') === p); if (subShape) { - const subShapeStyles = subShape.attr(); + const subShapeStyles = clone(subShape.attr()); each(style, (v, key) => { - if (subShapeStyles[key] || subShapeStyles[key] === 0) { + if (p === keyShapeName && keyShapeStyles[key] && !keptAttrs[key]) { + delete keyShapeStyles[key]; + const value = originStyle[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + shape.attr(key, value); + } else if (subShapeStyles[key] || subShapeStyles[key] === 0) { delete subShapeStyles[key]; + const value = originStyle[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + subShape.attr(key, value); } }); filtetDisableStatesStyle[p] = subShapeStyles; } } else { - // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值。使用对象检索更快 - const keptAttrs = { x: 1, y: 1, cx: 1, cy: 1 }; if (keyShapeStyles[p] && !keptAttrs[p]) { delete keyShapeStyles[p]; - shape.attr(p, originStyle[p]); + const value = originStyle[p] || (originStyle[keyShapeName] ? originStyle[keyShapeName][p] : undefined) || SHAPES_DEFAULT_ATTRS[type][p]; + shape.attr(p, value); } } } @@ -381,6 +428,7 @@ export const shapeBase: ShapeOptions = { } for (const key in enableStatesStyle) { + if (keptAttrs[key]) continue; const enableStyle = enableStatesStyle[key]; if (!isPlainObject(enableStyle) || ARROWS.includes(key)) { // 把样式属性merge到keyShape中 @@ -400,6 +448,7 @@ export const shapeBase: ShapeOptions = { const originstyles = {}; deepMix(originstyles, originStyle, filtetDisableStatesStyle, enableStatesStyle); + let keyShapeSetted = false; for (const originKey in originstyles) { const style = originstyles[originKey]; @@ -407,18 +456,20 @@ export const shapeBase: ShapeOptions = { const subShape = group.find((element) => element.get('name') === originKey); if (subShape) { subShape.attr(style); + if (originKey === keyShapeName) keyShapeSetted = true; } - } else { + } else if (!keyShapeSetted) { + const value = style || SHAPES_DEFAULT_ATTRS[type][originKey]; // 当更新 combo 状态时，当不存在 keyShapeName 时候，则认为是设置到 keyShape 上面的 if (type === 'combo') { if (!keyShapeName) { shape.attr({ - [originKey]: style, + [originKey]: value, }); } } else { shape.attr({ - [originKey]: style, + [originKey]: value, }); } } diff --git a/stories/Layout/component/dagre-layout.tsx b/stories/Layout/component/dagre-layout.tsx index bc99fb8ca95..4d08161c863 100644 --- a/stories/Layout/component/dagre-layout.tsx +++ b/stories/Layout/component/dagre-layout.tsx @@ -6,36 +6,155 @@ const data = { nodes: [ { id: '1', - name: 'name1', - size: [10, 20], + dataType: 'alps', + name: 'alps_file1', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '2', - name: 'name2', + dataType: 'alps', + name: 'alps_file2', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '3', - name: 'name3', + dataType: 'alps', + name: 'alps_file3', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '4', - name: 'name4', + dataType: 'sql', + name: 'sql_file1', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '5', - name: 'name5', + dataType: 'sql', + name: 'sql_file2', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '6', - name: 'name6', + dataType: 'feature_etl', + name: 'feature_etl_1', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '7', - name: 'name7', + dataType: 'feature_etl', + name: 'feature_etl_1', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, { id: '8', - name: 'name8', + dataType: 'feature_extractor', + name: 'feature_extractor', + conf: [ + { + label: 'conf', + value: 'pai_graph.conf', + }, + { + label: 'dot', + value: 'pai_graph.dot', + }, + { + label: 'init', + value: 'init.rc', + }, + ], }, ], edges: [ @@ -74,43 +193,50 @@ const data = { ], }; +G6.registerNode( + 'sql', + { + drawShape(cfg, group) { + const rect = group.addShape('rect', { + attrs: { + x: -75, + y: -25, + width: 150, + height: 50, + radius: 10, + stroke: '#5B8FF9', + fill: '#C6E5FF', + lineWidth: 3, + }, + name: 'rect-shape', + }); + if (cfg.name) { + group.addShape('text', { + attrs: { + text: cfg.name, + x: 0, + y: 0, + fill: '#00287E', + fontSize: 14, + textAlign: 'center', + textBaseline: 'middle', + fontWeight: 'bold', + }, + name: 'text-shape', + }); + } + return rect; + }, + }, + 'single-node', +); + let graph: IGraph = null; const DagreLayout = () => { const container = React.useRef(); useEffect(() => { if (!graph) { - G6.registerNode('sql', { - drawShape(cfg, group) { - const rect = group.addShape('rect', { - attrs: { - x: -75, - y: -25, - width: 150, - height: 50, - radius: 10, - stroke: '#5B8FF9', - fill: '#C6E5FF', - lineWidth: 3, - }, - }); - if (cfg.name) { - // group.addShape('text', { - // attrs: { - // text: cfg.name, - // x: 0, - // y: 0, - // fill: '#00287E', - // fontSize: 14, - // textAlign: 'center', - // textBaseline: 'middle', - // fontWeight: 'bold' - // } - // }); - } - return rect; - }, - }); // G6.Global.nodeStateStyle.selected = { // stroke: '#d9d9d9', // fill: '#5394ef' @@ -122,7 +248,6 @@ const DagreLayout = () => { height: 500, layout: { type: 'dagre', - controlPoints: true, nodesepFunc: (d) => { if (d.id === '3') { return 500; @@ -130,43 +255,44 @@ const DagreLayout = () => { return 50; }, ranksep: 70, + controlPoints: true, }, defaultNode: { - type: 'rect', + type: 'sql', }, defaultEdge: { type: 'polyline', style: { - radius: 0, - endArrow: { - path: 'M 0,0 L 0,4 L 8,-4 Z', - fill: '#ddd', - }, + radius: 20, + offset: 45, + endArrow: true, + lineWidth: 2, + stroke: '#C2C8D5', + }, + }, + nodeStateStyles: { + selected: { + stroke: '#d9d9d9', + fill: '#5394ef', }, }, modes: { default: [ 'drag-canvas', 'zoom-canvas', - 'click-select', + // 'click-select', // { // type: 'tooltip', // formatText(model) { - // const cfg: any = model.conf; + // const cfg = model.conf; // const text = []; - // cfg.forEach(row => { + // cfg.forEach((row) => { // text.push(row.label + ':' + row.value + '
'); // }); // return text.join('\n'); // }, - // shouldUpdate: e => { - // // 如果移动到节点文本上显示，不是文本上不显示 - // if (e.target.type !== 'text') { - // return false; - // } - // return true; - // } - // } + // offset: 30, + // }, ], }, fitView: true, @@ -174,10 +300,15 @@ const DagreLayout = () => { graph.data(data); graph.render(); - graph.on('canvas:click', (e) => { - console.log(graph.toDataURL('image/jpeg', '#fff')); - graph.downloadImage('test', 'image/png'); + let item; + graph.on('node:click', e => { + graph.setItemState(e.item, 'selected', true); + item = e.item; }); + graph.on('canvas:click', e => { + if (!item) return; + graph.setItemState(item, 'selected', false); + }) } }); return
; diff --git a/stories/Shape/component/rect.tsx b/stories/Shape/component/rect.tsx new file mode 100644 index 00000000000..5d343a7e99c --- /dev/null +++ b/stories/Shape/component/rect.tsx @@ -0,0 +1,49 @@ +import React, { useEffect } from 'react'; +import G6 from '../../../src'; +import { IGraph } from '../../../src/interface/graph'; + +let graph: IGraph = null; + +const Rect = () => { + const container = React.useRef(); + const data = { + nodes: [ + { + id: '0', + label: '0', + }, + ], + }; + useEffect(() => { + if (!graph) { + graph = new G6.Graph({ + container: container.current as string | HTMLElement, + width: 500, + height: 500, + layout: { + type: 'dagre', + rankdir: 'LR', + align: 'DL', + nodesepFunc: () => 1, + ranksepFunc: () => 1, + }, + defaultNode: { + type: 'rect', + }, + }); + } + + graph.data(data); + graph.render(); + graph.on('node:click', e => { + graph.setItemState(e.item, 'selected', true); + }) + graph.on('canvas:click', e => { + graph.setItemState(graph.getNodes()[0], 'selected', false); + }) + }); + + return
; +}; + +export default Rect; diff --git a/stories/Shape/shape.stories.tsx b/stories/Shape/shape.stories.tsx index 7fd68e966eb..3d506102b17 100644 --- a/stories/Shape/shape.stories.tsx +++ b/stories/Shape/shape.stories.tsx @@ -20,6 +20,7 @@ import PieChart from './component/pie-chart'; import MultiChart from './component/multi-chart'; import StateOpacity from './component/state-opacity'; import PolylineCombo from './component/polyline-combo'; +import Rect from './component/rect'; import XML from './component/xml'; @@ -55,4 +56,5 @@ storiesOf('Shape', module) .add('MultiChart', () => ) .add('xml node', () => ) .add('state opacity', () => ) - .add('polyline with combo', () => ); + .add('polyline with combo', () => ) + .add('rect', () => ); diff --git a/tests/unit/graph/svg-spec.ts b/tests/unit/graph/svg-spec.ts index 03e7cee71e6..da744d1e122 100644 --- a/tests/unit/graph/svg-spec.ts +++ b/tests/unit/graph/svg-spec.ts @@ -1237,7 +1237,7 @@ describe('behaviors', () => { expect(itemKeyShape.attr('lineWidth')).toBe(1); expect(unrelativeNodeKeyShape.attr('lineWidth')).toBe(1); expect(unrelativeNodeKeyShape.attr('stroke')).toBe('rgb(95, 149, 255)'); - expect(unrelativeNodeKeyShape.attr('opacity')).toBe(undefined); + expect(unrelativeNodeKeyShape.attr('opacity')).toBe(1); }); it('click-select', () => { graph.setMode('select'); @@ -1314,8 +1314,8 @@ describe('behaviors', () => { expect(item.getModel().x).toBe(100); expect(item.getModel().y).toBe(300); const edge = graph.getEdges()[0]; - expect((edge.getModel() as EdgeConfig).startPoint.x).toBe(98.61228093904431); - expect((edge.getModel() as EdgeConfig).startPoint.y).toBe(289.5921070428323); + expect((edge.getModel() as EdgeConfig).startPoint.x).toBe(98.5461990789988); + expect((edge.getModel() as EdgeConfig).startPoint.y).toBe(289.096493092491); // multiple selected nodes to drag const item2 = graph.getNodes()[1]; diff --git a/tests/unit/shape/combo-spec.ts b/tests/unit/shape/combo-spec.ts index 3e560e6d7df..7ff49201f7e 100644 --- a/tests/unit/shape/combo-spec.ts +++ b/tests/unit/shape/combo-spec.ts @@ -181,7 +181,7 @@ describe('combo node test', () => { factory.setState('rectnode', 'active', true, item); expect(shape.attr('fillOpacity')).not.toBe(1); factory.setState('rectnode', 'active', false, item); - expect(shape.attr('fillOpacity')).toBe(undefined); + expect(shape.attr('fillOpacity')).toBe(1); }); it('label position', () => { diff --git a/tests/unit/shape/node-spec.ts b/tests/unit/shape/node-spec.ts index 266a2145889..24d70c2a12f 100644 --- a/tests/unit/shape/node-spec.ts +++ b/tests/unit/shape/node-spec.ts @@ -238,7 +238,7 @@ describe('shape node test', () => { factory.setState('rectnode', 'active', true, item); expect(shape.attr('fillOpacity')).not.toBe(1); factory.setState('rectnode', 'active', false, item); - expect(shape.attr('fillOpacity')).toBe(undefined); + expect(shape.attr('fillOpacity')).toBe(1); }); it('selected', () => { diff --git a/tests/unit/state/edge-state-spec.ts b/tests/unit/state/edge-state-spec.ts index 1c401e149a5..0d2c1dbf674 100644 --- a/tests/unit/state/edge-state-spec.ts +++ b/tests/unit/state/edge-state-spec.ts @@ -75,7 +75,7 @@ describe('graph edge states', () => { graph.setItemState(item, 'hover', false); expect(item.hasState('hover')).toEqual(false); const keyShape = item.getKeyShape(); - expect(keyShape.attr('opacity')).toEqual(undefined); + expect(keyShape.attr('opacity')).toEqual(1); expect(keyShape.attr('lineWidth')).toEqual(3); expect(keyShape.attr('stroke')).toEqual('steelblue'); }); @@ -165,9 +165,9 @@ describe('graph edge states', () => { graph.setItemState(item, 'hover', false); const keyShape = item.getKeyShape(); expect(keyShape.attr('shadowColor')).toEqual(undefined); - expect(keyShape.attr('shadowBlur')).toEqual(undefined); - expect(keyShape.attr('shadowOffsetX')).toEqual(undefined); - expect(keyShape.attr('shadowOffsetY')).toEqual(undefined); + expect(keyShape.attr('shadowBlur')).toEqual(0); + expect(keyShape.attr('shadowOffsetX')).toEqual(0); + expect(keyShape.attr('shadowOffsetY')).toEqual(0); expect(keyShape.attr('lineWidth')).toEqual(10); }); @@ -303,9 +303,9 @@ describe('graph edge states', () => { const curShadowOffsetX = keyShape.attr('shadowBlur'); const curShadowOffsetY = keyShape.attr('shadowBlur'); expect(curOpacity === undefined || curOpacity === null).toEqual(true); - expect(curShadowBlur === undefined || curShadowBlur === null).toEqual(true); - expect(curShadowOffsetX === undefined || curShadowOffsetX === null).toEqual(true); - expect(curShadowOffsetY === undefined || curShadowOffsetY === null).toEqual(true); + expect(curShadowBlur === 0 || curShadowBlur === undefined || curShadowBlur === null).toEqual(true); + expect(curShadowOffsetX === 0 || curShadowOffsetX === undefined || curShadowOffsetX === null).toEqual(true); + expect(curShadowOffsetY === 0 || curShadowOffsetY === undefined || curShadowOffsetY === null).toEqual(true); expect(keyShape.attr('lineWidth')).toEqual(1); expect(keyShape.attr('stroke')).toEqual('#aaa'); }); diff --git a/tests/unit/state/refactor-state-spec.ts b/tests/unit/state/refactor-state-spec.ts index 464eb6bf244..b364de2de72 100644 --- a/tests/unit/state/refactor-state-spec.ts +++ b/tests/unit/state/refactor-state-spec.ts @@ -26,7 +26,7 @@ G6.registerNode( fill: 'red', y: 0, ...keyShapeStyle, - r: 20, + r: cfg.size / 2, }, name: 'main-node', }); @@ -114,7 +114,7 @@ describe('graph refactor states', () => { ], }; - it.only('compatible true/false states', () => { + it('compatible true/false states', () => { const graph = new G6.Graph({ container: div, width: 500, @@ -172,14 +172,14 @@ describe('graph refactor states', () => { expect(item.hasState('select')).toBe(false); expect(item.getStates()).toEqual(['hover']); expect(keyShape.attr('lineWidth')).toBe(1); - expect(keyShape.attr('stroke')).toBe('rgb(95, 149, 255)'); + expect(keyShape.attr('stroke')).toBe(undefined); // remove hover states graph.setItemState(item, 'hover', false); expect(item.hasState('hover')).toBe(false); expect(item.getStates()).toEqual([]); expect(keyShape.attr('opacity')).toEqual(0.8); - // graph.destroy(); + graph.destroy(); }); it('multivalued & muted', () => { @@ -191,12 +191,12 @@ describe('graph refactor states', () => { 'selfCircle:selected': { 'main-node': { fill: '#000', - stroke: 'yellow', + stroke: 'red', lineWidth: 3, }, 'sub-node': { fill: 'green', - stroke: 'yellow', + stroke: 'red', lineWidth: 3, }, }, @@ -469,8 +469,9 @@ describe('graph refactor states', () => { expect(keyShape.attr('stroke')).toEqual(undefined); expect(subShape.attr('fill')).toEqual('blue'); - // 设置 selfCircle:hover，目前只有这一个状态 + // // 设置 selfCircle:hover，目前只有这一个状态 graph.setItemState(item, 'selfCircle', 'hover'); + console.log(item) expect(item.getStates().length).toBe(1); expect(item.hasState('selfCircle:hover')).toBe(true); @@ -595,17 +596,13 @@ describe('graph refactor states', () => { const shape2 = group2.find((ele) => ele.get('name') === 'sub-node'); expect(shape2.attr('stroke')).toEqual('#1cd8a7'); + // node3 是 rect 且没有配置对应的 stateStyle，所以不受影响 const node3 = graph.findById('node3'); graph.setItemState(node3, 'selfCircle', 'selected'); expect(node3.hasState('selfCircle:selected')).toBe(true); const keyshape3 = node3.getKeyShape(); - expect(keyshape3.attr('stroke')).toEqual('#000'); - expect(keyshape3.attr('lineWidth')).toEqual(3); - - const group3 = node3.getContainer(); - const shape3 = group3.find((ele) => ele.get('name') === 'sub-node'); - expect(shape3.attr('stroke')).toEqual('green'); - expect(shape3.attr('lineWidth')).toEqual(3); + expect(keyshape3.attr('stroke')).toEqual('rgb(95, 149, 255)'); + expect(keyshape3.attr('lineWidth')).toEqual(1); // 清除 node1 的状态 graph.clearItemStates(node1, ['selfCircle:selected']);