Skip to content

R
relation-graph
Commit ef69b7de authored by 郭铭瑶's avatar 郭铭瑶 🤘
Browse files
Options

新增要素接口改动及批量新增附属节点功能添加

parent b9257356
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 246 additions and 99 deletions
package-lock.json
View file @ ef69b7de
......@@ -20,7 +20,7 @@
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^7.4.1",
"naive-ui": "^2.16.2",
"naive-ui": "^2.16.5",
"prettier": "^2.2.1",
"stylus": "^0.54.8",
"vite": "^2.1.0"
......@@ -617,9 +617,9 @@
}
},
"node_modules/async-validator": {
"version": "3.5.2",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-3.5.2.tgz",
"integrity": "sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==",
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.0.2.tgz",
"integrity": "sha512-wPFnOgf9uIu/7uvptlX7PepSf2ArGt60Wng0bYrQ08eZVFG65LRLQpHKQebWEyAYtJcdPN31kndy4nS0jVnf0Q==",
"dev": true
},
"node_modules/atob": {
......@@ -2327,16 +2327,17 @@
"dev": true
},
"node_modules/naive-ui": {
"version": "2.16.2",
"resolved": "https://registry.npmjs.org/naive-ui/-/naive-ui-2.16.2.tgz",
"integrity": "sha512-pIQyg5Im0E3j4BI6Fb3zQRUqqHKLe1zqUEIDJ2GmDzTi9SZIxhSTj4t1ck9C43aCNu93QORZLf7e0sgJLf6LQg==",
"version": "2.16.5",
"resolved": "https://registry.npmjs.org/naive-ui/-/naive-ui-2.16.5.tgz",
"integrity": "sha512-nqIQTivPETbHR+Z7It0iSXlYe71Az5Hi5IBJ1l2tRSNWZU2Tz9v5vMf9F78xfIz1o2Mb+cmQV7PuMazc/EbGXQ==",
"dev": true,
"license": "MIT",
"dependencies": {
"@css-render/plugin-bem": "^0.15.4",
"@css-render/vue3-ssr": "^0.15.4",
"@types/lodash": "^4.14.170",
"@types/lodash-es": "^4.17.4",
"async-validator": "^3.5.1",
"async-validator": "^4.0.1",
"css-render": "^0.15.4",
"date-fns": "^2.19.0",
"evtd": "^0.2.2",
......@@ -2344,7 +2345,7 @@
"lodash": "^4.17.21",
"lodash-es": "^4.17.21",
"seemly": "^0.3.1",
"treemate": "^0.2.12",
"treemate": "^0.3.0",
"vdirs": "^0.1.4",
"vfonts": "^0.1.0",
"vooks": "^0.2.6",
......@@ -3122,9 +3123,9 @@
}
},
"node_modules/treemate": {
"version": "0.2.12",
"resolved": "https://registry.npmjs.org/treemate/-/treemate-0.2.12.tgz",
"integrity": "sha512-li5ZxaT7BtBIEnT7eUO3mk4BdefANPUKjCGnTciFp5e5UDy3+07HLvWelKxuIz1jCz+6r5IPoP8P/5+8Xz9Z7w==",
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/treemate/-/treemate-0.3.2.tgz",
"integrity": "sha512-vy4x0kVfNHxNh+AmXbvrCklYc6HlPpIgqy2zzCStBnqdlhuHP+PaOfKUS3YyISAPhj4g4KdqmvfYrgQV2SF6Ag==",
"dev": true
},
"node_modules/type-check": {
......@@ -3832,9 +3833,9 @@
"dev": true
},
"async-validator": {
"version": "3.5.2",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-3.5.2.tgz",
"integrity": "sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==",
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.0.2.tgz",
"integrity": "sha512-wPFnOgf9uIu/7uvptlX7PepSf2ArGt60Wng0bYrQ08eZVFG65LRLQpHKQebWEyAYtJcdPN31kndy4nS0jVnf0Q==",
"dev": true
},
"atob": {
......@@ -5113,16 +5114,16 @@
"dev": true
},
"naive-ui": {
"version": "2.16.2",
"resolved": "https://registry.npmjs.org/naive-ui/-/naive-ui-2.16.2.tgz",
"integrity": "sha512-pIQyg5Im0E3j4BI6Fb3zQRUqqHKLe1zqUEIDJ2GmDzTi9SZIxhSTj4t1ck9C43aCNu93QORZLf7e0sgJLf6LQg==",
"version": "2.16.5",
"resolved": "https://registry.npmjs.org/naive-ui/-/naive-ui-2.16.5.tgz",
"integrity": "sha512-nqIQTivPETbHR+Z7It0iSXlYe71Az5Hi5IBJ1l2tRSNWZU2Tz9v5vMf9F78xfIz1o2Mb+cmQV7PuMazc/EbGXQ==",
"dev": true,
"requires": {
"@css-render/plugin-bem": "^0.15.4",
"@css-render/vue3-ssr": "^0.15.4",
"@types/lodash": "^4.14.170",
"@types/lodash-es": "^4.17.4",
"async-validator": "^3.5.1",
"async-validator": "^4.0.1",
"css-render": "^0.15.4",
"date-fns": "^2.19.0",
"evtd": "^0.2.2",
......@@ -5130,7 +5131,7 @@
"lodash": "^4.17.21",
"lodash-es": "^4.17.21",
"seemly": "^0.3.1",
"treemate": "^0.2.12",
"treemate": "^0.3.0",
"vdirs": "^0.1.4",
"vfonts": "^0.1.0",
"vooks": "^0.2.6",
......@@ -5718,9 +5719,9 @@
"integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4="
},
"treemate": {
"version": "0.2.12",
"resolved": "https://registry.npmjs.org/treemate/-/treemate-0.2.12.tgz",
"integrity": "sha512-li5ZxaT7BtBIEnT7eUO3mk4BdefANPUKjCGnTciFp5e5UDy3+07HLvWelKxuIz1jCz+6r5IPoP8P/5+8Xz9Z7w==",
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/treemate/-/treemate-0.3.2.tgz",
"integrity": "sha512-vy4x0kVfNHxNh+AmXbvrCklYc6HlPpIgqy2zzCStBnqdlhuHP+PaOfKUS3YyISAPhj4g4KdqmvfYrgQV2SF6Ag==",
"dev": true
},
"type-check": {
......
package.json
View file @ ef69b7de
......@@ -20,7 +20,7 @@
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^7.4.1",
"naive-ui": "^2.16.2",
"naive-ui": "^2.16.5",
"prettier": "^2.2.1",
"stylus": "^0.54.8",
"vite": "^2.1.0"
......
src/components/d3.vue
View file @ ef69b7de
......@@ -163,7 +163,7 @@ export default {
function switchName(key) {
switch (key) {
case 'Subject':
return '主体'
return '要素'
case 'System':
return '系统'
case 'Property_property':
......
src/components/footer.vue
View file @ ef69b7de
......@@ -22,7 +22,7 @@
</svg>
</n-icon>
</template>
新增主体
新增要素
</n-button>
<n-input-group size="small" class="search-bar">
<n-select
......@@ -163,7 +163,7 @@ export default defineComponent({
}
const nodeOptions = ref([
{ label: '主体', value: 'Subject' },
{ label: '要素', value: 'Subject' },
{ label: '附属节点', value: 'Property' },
{ label: '系统', value: 'System' },
])
......@@ -171,7 +171,7 @@ export default defineComponent({
function switchName(key) {
switch (key) {
case 'Subject':
return '主体'
return '要素'
case 'System':
return '系统'
case 'Property_property':
......
src/components/main.vue
View file @ ef69b7de
This diff is collapsed.
src/main.js
View file @ ef69b7de
......@@ -16,6 +16,7 @@ import {
NMessageProvider,
NDialogProvider,
NIcon,
NDivider,
} from 'naive-ui'
const naive = create({
......@@ -33,6 +34,7 @@ const naive = create({
NMessageProvider,
NDialogProvider,
NIcon,
NDivider,
],
})
......
src/util/useD3.js
View file @ ef69b7de
......@@ -83,7 +83,7 @@ const defaultConfig = {
isHighLight: true, // 是否启动 鼠标 hover 到节点上高亮与节点有关的节点，其他无关节点透明的功能
isScale: true, // 是否启用缩放平移zoom功能
scaleExtent: [0.6, 1.5], // 缩放的比例尺
chargeStrength: -300, // 万有引力
chargeStrength: 300, // 万有引力
collide: 80, // 碰撞力的大小 （节点之间的间距）
alphaDecay: 0.1, // 控制力学模拟衰减率
r: 36, // 圈圈的半径 [30 - 45]
......@@ -392,7 +392,7 @@ export default class RelationGraph {
// simulation.force(name,[force])函数，添加某种力
.force('link', d3.forceLink(this.config.links))
// 万有引力
// .force('charge', d3.forceManyBody().strength(this.config.chargeStrength))
.force('charge', d3.forceManyBody().strength(this.config.chargeStrength))
// d3.forceCenter()用指定的x坐标和y坐标创建一个新的居中力。
.force(
'center',
......@@ -438,8 +438,8 @@ export default class RelationGraph {
this.simulation
.nodes(this.config.nodes)
.force('link', d3.forceLink(this.config.links))
.force('charge', null)
.alpha(0.3)
// .force('charge', null)
.alpha(1)
.restart()
}
......@@ -466,12 +466,17 @@ export default class RelationGraph {
this.curActiveNode && (this.curActiveNode.fx = null)
this.curActiveNode && (this.curActiveNode.fy = null)
}
closeMenu(needClearFixedPosition) {
needClearFixedPosition && this.clearFixedPosition()
closeMenu(needClearFixedPositionNow) {
if (menu) {
menu.hide()
menu = null
}
if (needClearFixedPositionNow) {
this.clearFixedPosition()
}
// else {
// setTimeout(() => this.clearFixedPosition(), 1000)
// }
}
init() {
......@@ -620,7 +625,7 @@ export default class RelationGraph {
this.SVG.selectAll('.edge')
.filter((d) => this.dependsLink.indexOf(d.index) == -1)
.transition()
.style('opacity', 0.3)
.style('opacity', 0.1)
} else {
// 取消高亮
// 恢复隐藏的线
......@@ -654,7 +659,7 @@ export default class RelationGraph {
this.SVG.selectAll('.edge')
.filter((d) => d.id != obj.id)
.transition()
.style('opacity', 0.3)
.style('opacity', 0.1)
} else {
this.SVG.selectAll('circle').transition().style('opacity', 1)
this.SVG.selectAll('.edge').transition().style('opacity', 1)
......@@ -671,8 +676,7 @@ export default class RelationGraph {
if (!key || this.curActiveNode.nodeLabel !== 'Subject') {
this.curHighlightKey = null
this.config.isHighLight = true
key = null
// return false
return false
}
this.highlightObject(this.curActiveNode)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment