mds layout

This commit is contained in:
shiwu.wyy 2019-07-19 09:56:53 +08:00
parent 7fbe3d6bc1
commit e4224c29e2
3 changed files with 13 additions and 8 deletions

View File

@ -7,8 +7,7 @@
<body> <body>
<div id="mountNode"></div> <div id="mountNode"></div>
<script src="../build/g6.js"></script> <script src="../build/g6.js"></script>
<script src="./assets/d3-4.13.0.min.js"></script> <script src="../build/mds.js"></script>
<script src="../build/radial.js"></script>
<script> <script>
const data = { const data = {
@ -115,7 +114,7 @@
data.edges.forEach((edge, i) => { data.edges.forEach((edge, i) => {
edge.id = i; edge.id = i;
}); });
const MDSPlugin = new MDS({ const MDSPlugin = new Mds({
center: [ 500, 300 ], center: [ 500, 300 ],
linkDistance: 100 linkDistance: 100
}); });
@ -123,7 +122,8 @@
container: 'mountNode', container: 'mountNode',
width: 1000, width: 1000,
height: 600, height: 600,
plugins: [ MDSPlugin ], plugins: [ MDSPlugin ],
modes: { default: [ 'drag-node' ] },
defaultNode: { defaultNode: {
size: [20, 20], size: [20, 20],
color: 'steelblue' color: 'steelblue'

View File

@ -3,6 +3,7 @@ const G6Plugins = {
Grid: require('./grid'), Grid: require('./grid'),
Force: require('./force'), Force: require('./force'),
Radial: require('./radial'), Radial: require('./radial'),
Mds: require('./mds'),
Dagre: require('./dagre'), Dagre: require('./dagre'),
Menu: require('./menu') Menu: require('./menu')
}; };

View File

@ -1,9 +1,8 @@
// const Numeric = require('numericjs');
const Base = require('../base'); const Base = require('../base');
const Util = require('@antv/g6').Util; const Util = require('@antv/g6').Util;
const Numeric = require('numericjs'); const Numeric = require('numericjs');
class MDS extends Base { class Mds extends Base {
getDefaultCfgs() { getDefaultCfgs() {
return { return {
maxIteration: null, // 停止迭代的最大迭代数 maxIteration: null, // 停止迭代的最大迭代数
@ -26,8 +25,13 @@ class MDS extends Base {
const self = this; const self = this;
self.set('data', data); self.set('data', data);
const graph = self.get('graph'); const graph = self.get('graph');
const nodes = data.nodes;
const center = self.get('center'); const center = self.get('center');
const nodes = data.nodes;
if (nodes.length === 0) return;
else if (nodes.length === 1) {
nodes[0].x = center[0];
nodes[0].y = center[1];
}
const linkDistance = self.get('linkDistance'); const linkDistance = self.get('linkDistance');
// 如果正在布局,忽略布局请求 // 如果正在布局,忽略布局请求
@ -128,4 +132,4 @@ class MDS extends Base {
super.destroy(); super.destroy();
} }
} }
module.exports = MDS; module.exports = Mds;