Commit 27ce9a22 by jlc

update:bug修改和细节优化

parent 18c4e3c4
...@@ -48,6 +48,10 @@ var myDiagram: any; ...@@ -48,6 +48,10 @@ var myDiagram: any;
const dialogVisible = ref(false) const dialogVisible = ref(false)
const changeModel = ref(true) const changeModel = ref(true)
// 计算偏移量变量
const dragStartOffsetX = ref()
const dragStartOffsetY = ref()
// 切换添加端口/标定点的形式 // 切换添加端口/标定点的形式
function toggleDivs(value: boolean) { function toggleDivs(value: boolean) {
changeModel.value = value; changeModel.value = value;
...@@ -443,7 +447,13 @@ function initDiagram() { ...@@ -443,7 +447,13 @@ function initDiagram() {
{ {
click: function(e) { click: function(e) {
e.diagram.commit(function(d) { e.diagram.commit(function(d) {
var data = {}; var data = {
key: "new node",
color: 'aqua',
portArray: [],
markArray: [],
category: ""
};
d.model.addNodeData(data); d.model.addNodeData(data);
var part = d.findPartForData(data); var part = d.findPartForData(data);
// 在ContextMenuTool中设置保存mouseDownPoint的位置 // 在ContextMenuTool中设置保存mouseDownPoint的位置
...@@ -474,7 +484,10 @@ function initDiagram() { ...@@ -474,7 +484,10 @@ function initDiagram() {
"_buttonFillOver": "skyblue", "_buttonFillOver": "skyblue",
}, },
new go.Binding("visible", "", function(o) { // 根据是否有可撤销的操作来决定是否可见 new go.Binding("visible", "", function(o) { // 根据是否有可撤销的操作来决定是否可见
if (o && o.diagram) {
return o.diagram.commandHandler.canUndo(); // 可以撤销返回true,否则返回false return o.diagram.commandHandler.canUndo(); // 可以撤销返回true,否则返回false
}
return false;
}).ofObject()), }).ofObject()),
// 重做按钮 // 重做按钮
$("ContextMenuButton", $("ContextMenuButton",
...@@ -485,7 +498,10 @@ function initDiagram() { ...@@ -485,7 +498,10 @@ function initDiagram() {
"_buttonFillOver": "skyblue", "_buttonFillOver": "skyblue",
}, },
new go.Binding("visible", "", function(o) { // 根据是否有可重做的操作来决定是否可见 new go.Binding("visible", "", function(o) { // 根据是否有可重做的操作来决定是否可见
if (o && o.diagram) {
return o.diagram.commandHandler.canRedo(); // 可以重做返回true,否则返回false return o.diagram.commandHandler.canRedo(); // 可以重做返回true,否则返回false
}
return false;
}).ofObject()) }).ofObject())
); );
...@@ -509,15 +525,13 @@ function initDiagram() { ...@@ -509,15 +525,13 @@ function initDiagram() {
); );
} }
// 导出画布中的节点和连线数据
function exportData() { function exportData() {
if (myDiagram) { if (myDiagram) {
console.log(myDiagram.model.toJson()); console.log(myDiagram.model.toJson());
} }
} }
const dragStartOffsetX = ref()
const dragStartOffsetY = ref()
// 获取拖动开始时的偏移量 // 获取拖动开始时的偏移量
function dragstart(event: any){ function dragstart(event: any){
const target = event.target; const target = event.target;
...@@ -539,21 +553,16 @@ function drop(event: any) { ...@@ -539,21 +553,16 @@ function drop(event: any) {
// 获取像素比率 // 获取像素比率
const pixelRatio = myDiagram.computePixelRatio(); const pixelRatio = myDiagram.computePixelRatio();
if (!(target instanceof HTMLCanvasElement)) return; if (!(target instanceof HTMLCanvasElement)) return;
// 获取目标元素的边界框 // 获取目标元素的边界框
const bbox = target.getBoundingClientRect(); const bbox = target.getBoundingClientRect();
let bbw = bbox.width; let bbw = bbox.width;
if (bbw === 0) bbw = 0.001; if (bbw === 0) bbw = 0.001;
let bbh = bbox.height; let bbh = bbox.height;
if (bbh === 0) bbh = 0.001; if (bbh === 0) bbh = 0.001;
// console.log(bbox)
// 计算鼠标在画布上的位置 // 计算鼠标在画布上的位置
const mx = event.clientX - bbox.left * (target.width / pixelRatio / bbw); const mx = event.clientX - bbox.left * (target.width / pixelRatio / bbw);
const my = event.clientY - bbox.top * (target.height / pixelRatio / bbh); const my = event.clientY - bbox.top * (target.height / pixelRatio / bbh);
const point = myDiagram.transformViewToDoc(new go.Point(mx - dragStartOffsetX.value, my - dragStartOffsetY.value)); const point = myDiagram.transformViewToDoc(new go.Point(mx - dragStartOffsetX.value, my - dragStartOffsetY.value));
// console.log(mx)
// console.log(my)
// console.log(point)
// 开始一个新的事务 // 开始一个新的事务
myDiagram.startTransaction('new node'); myDiagram.startTransaction('new node');
// 获取拖动数据 // 获取拖动数据
......
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