Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
4f6f3235 by zhaoqian
Options

历史回溯，样式调整

1 parent 0c707bb8
Inline Side-by-side
Showing 1 changed file with 30 additions and 85 deletions
<template>
<div class="lshs-content">
<div class="slot">
<div><span class="tip-title">范围属性变更：</span></div>
<div><span class="tip-title">宗地分割：</span></div>
<div><span class="tip-title">宗地合并：</span></div>
</div>
<!-- <div class="slot">-->
<!-- <div><span class="tip-title">范围属性变更：</span></div>-->
<!-- <div><span class="tip-title">宗地分割：</span></div>-->
<!-- <div><span class="tip-title">宗地合并：</span></div>-->
<!-- </div>-->
<div id="mountNode" ref="containerWidth"></div>
<div id="mountNodeRight"></div>
</div>
</template>
......@@ -51,9 +52,9 @@ export default {
drawShape(cfg, group) {
const rect = group.addShape('rect', {
attrs: {
x: -75,
x: -100,
y: -25,
width: 150,
width: 200,
height: 50,
radius: 10,
stroke: '#5B8FF9',
......@@ -83,38 +84,14 @@ export default {
'single-node',
);
G6.registerEdge(
'circle-running',
'polyline1',
{
afterDraw(cfg, group) {
const shape = group.get('children')[0];
const startPoint = shape.getPoint(0);
const circle = group.addShape('circle', {
attrs: {
x: startPoint.x,
y: startPoint.y,
fill: '#1890ff',
r: 3,
},
name: 'circle-shape',
});
circle.animate(
(ratio) => {
const tmpPoint = shape.getPoint(ratio);
return {
x: tmpPoint.x,
y: tmpPoint.y,
};
},
{
repeat: true,
duration: 3000,
},
);
},
afterDraw(cfg, group) {
console.log(cfg.data+":cfg")
console.log(group.toString()+"group")
},
},
'line',
'polyline',
);
const tooltip = new G6.Tooltip({
......@@ -146,33 +123,24 @@ export default {
layout: {
type: 'dagre',
nodesepFunc: (d) => {
if (d.id === '3') {
return 500;
}
return 50;
return 100;
},
ranksep: 70,
ranksep: 30,
controlPoints: true,
},
defaultNode: {
type: 'sql',
},
defaultEdge: {
type: 'polyline',
type: 'polyline1',
style: {
radius: 20,
offset: 45,
endArrow: true,
radius: 10,
offset: 10,
// endArrow: true,
lineWidth: 2,
stroke: 'rgba(78,142,230,0.45)',
},
},
// defaultEdge: {
// type: 'cubic-vertical',
// style: {
// stroke: '#F6BD16',
// },
// },
nodeStateStyles: {
selected: {
stroke: '#d9d9d9',
......@@ -221,44 +189,12 @@ export default {
getLshsData(){
let _this = this;
const data = {
"bsm": "c0818d9e4286b35b8ee9b96d90b522aa",
"bsm": "d85a274a332ad2d35c922a3a95eb154f",
"type": "zd"
};
getLshs(data).then((res)=>{
if(res.code===200){
_this.data=res.result;
_this.data = {"nodes":[
{"id":"836524edab33ab19bb0e0b4fd064cd77","dataType":"sql","name":"20201127宗地A",
"conf":[{"label":"宗地代码","value":"610102123666GA10002"},{"label":"项目名称","value":"20201127宗地A"},
{"label":"不动产单元号","value":"610102123666GA10002W00000000"},{"label":"坐落","value":"610102123666G10003W"},
{"label":"权利人","value":""}]},
{"id":"601130536a6bf6efc7a248af469e982c","dataType":"sql","name":"20201127宗地A222221",
"conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地A222221"},
{"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
{"id":"c0818d9e4286b35b8ee9b96d90b522aa","dataType":"sql","name":"20201127宗地A2222222",
"conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地A2222222"},
{"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
{"id":"601130536a6bf6efc7a248af469e982c1","dataType":"sql","name":"20201127宗地B",
"conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地B"},
{"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
{"id":"c0818d9e4286b35b8ee9b96d90b522aa1","dataType":"sql","name":"20201127宗地B1",
"conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地B1"},
{"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
{"id":"c0818d9e4286b35b8ee9b96d90b522aa12","dataType":"sql","name":"20201127宗地C",
"conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地C"},
{"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
],
"edges":[
{"source":"836524edab33ab19bb0e0b4fd064cd77","target":"601130536a6bf6efc7a248af469e982c"},
{"source":"836524edab33ab19bb0e0b4fd064cd77","target":"c0818d9e4286b35b8ee9b96d90b522aa"},
{"source":"c0818d9e4286b35b8ee9b96d90b522aa","target":"601130536a6bf6efc7a248af469e982c1"},
{"source":"c0818d9e4286b35b8ee9b96d90b522aa","target":"c0818d9e4286b35b8ee9b96d90b522aa1"},
{"source":"601130536a6bf6efc7a248af469e982c1","target":"c0818d9e4286b35b8ee9b96d90b522aa12"},
{"source":"c0818d9e4286b35b8ee9b96d90b522aa1","target":"c0818d9e4286b35b8ee9b96d90b522aa12"},
]};
this.initG6();
}
})
......@@ -278,6 +214,15 @@ export default {
#mountNode{
/*height: calc(100% - 68px);*/
margin-top: -60px;
width: 60%;
float: left;
}
#mountNodeRight{
width: 38%;
float: right;
height: 1000px;
border: 0 solid #5ebbff;
}
.slot{
......