修复导线连接只能垂直或者水平
parent
2611df4898
commit
20b4f6ba9d
|
@ -80,7 +80,6 @@ function doSave(value, type, name) {
|
|||
type: type
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
var BlobBuilder = window.BlobBuilder || window.MozBlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder;
|
||||
|
|
|
@ -59,20 +59,18 @@ class AltiumSchematicRenderer
|
|||
this.graph.removeCells();
|
||||
}
|
||||
render() {
|
||||
|
||||
|
||||
this.graph = new mxGraph(document.getElementById('graphContainer'));
|
||||
|
||||
mxConnectionHandler.prototype.movePreviewAway = true;
|
||||
mxConnectionHandler.prototype.movePreviewAway = false;
|
||||
mxConnectionHandler.prototype.waypointsEnabled = true;
|
||||
mxGraph.prototype.resetEdgesOnConnect = true;
|
||||
mxGraph.prototype.resetEdgesOnConnect = false;
|
||||
mxConstants.SHADOWCOLOR = '#C0C0C0';
|
||||
var joinNodeSize = 4;
|
||||
var strokeWidth = 2;
|
||||
|
||||
|
||||
// Enables guides
|
||||
mxGraphHandler.prototype.guidesEnabled = false;
|
||||
mxGraphHandler.prototype.guidesEnabled = true; // 启用导航线
|
||||
|
||||
// Alt disables guides
|
||||
mxGuide.prototype.isEnabledForEvent = function(evt)
|
||||
|
@ -81,13 +79,12 @@ class AltiumSchematicRenderer
|
|||
};
|
||||
|
||||
// Enables snapping waypoints to terminals
|
||||
mxEdgeHandler.prototype.snapToTerminals = true;
|
||||
|
||||
|
||||
mxEdgeHandler.prototype.snapToTerminals = false; // 自动连接目标
|
||||
mxEdgeStyle.WireConnector = function(state, source, target, hints, result)
|
||||
{
|
||||
mxLog.debug('add waypoint');
|
||||
mxLog.debug("WireConnector",state,source,target,hint)
|
||||
console.log(hint)
|
||||
|
||||
|
||||
// Creates array of all way- and terminalpoints
|
||||
var pts = state.absolutePoints;
|
||||
var horizontal = true;
|
||||
|
@ -98,15 +95,13 @@ class AltiumSchematicRenderer
|
|||
{
|
||||
horizontal = state.style['sourceConstraint'] == 'horizontal';
|
||||
}
|
||||
else if (source != null)
|
||||
{
|
||||
else if (source != null) {
|
||||
horizontal = source.style['portConstraint'] != 'vertical';
|
||||
|
||||
// Checks the direction of the shape and rotates
|
||||
var direction = source.style[mxConstants.STYLE_DIRECTION];
|
||||
|
||||
if (direction == 'north' || direction == 'south')
|
||||
{
|
||||
if (direction == 'north' || direction == 'south') {
|
||||
horizontal = !horizontal;
|
||||
}
|
||||
}
|
||||
|
@ -125,12 +120,12 @@ class AltiumSchematicRenderer
|
|||
}
|
||||
|
||||
var first = pt;
|
||||
|
||||
console.log(hints)
|
||||
// Adds the waypoints
|
||||
if (hints != null && hints.length > 0)
|
||||
{
|
||||
// FIXME: First segment not movable
|
||||
hint = state.view.transformControlPoint(state, hints[0]);
|
||||
/*hint = state.view.transformControlPoint(state, hints[0]);
|
||||
mxLog.show();
|
||||
mxLog.debug(hints.length,'hints0.y='+hint.y, pt.y)
|
||||
|
||||
|
@ -143,57 +138,155 @@ class AltiumSchematicRenderer
|
|||
result.push(pt);
|
||||
pt = pt.clone();
|
||||
//horizontal = !horizontal;
|
||||
}
|
||||
}*/
|
||||
|
||||
for (var i = 0; i < hints.length; i++)
|
||||
{
|
||||
for (var i = 0; i < hints.length; i++) {
|
||||
horizontal = !horizontal;
|
||||
hint = state.view.transformControlPoint(state, hints[i]);
|
||||
|
||||
if (horizontal)
|
||||
{
|
||||
if (pt.y != hint.y)
|
||||
{
|
||||
if (pt.y != hint.y) {
|
||||
pt.y = hint.y;
|
||||
result.push(pt.clone());
|
||||
}
|
||||
}
|
||||
else if (pt.x != hint.x)
|
||||
{
|
||||
else if (pt.x != hint.x) {
|
||||
pt.x = hint.x;
|
||||
result.push(pt.clone());
|
||||
}
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
else {
|
||||
hint = pt;
|
||||
}
|
||||
|
||||
// Adds the last point
|
||||
pt = pts[pts.length - 1];
|
||||
|
||||
// TODO: Should move along connected segment
|
||||
if (pt == null && target != null)
|
||||
{
|
||||
pt = new mxPoint(state.view.getRoutingCenterX(target), state.view.getRoutingCenterY(target));
|
||||
if (pt == null && target != null) {
|
||||
pt = new mxPoint(state.view.getRoutingCenterX(target),
|
||||
state.view.getRoutingCenterY(target));
|
||||
}
|
||||
|
||||
if (horizontal)
|
||||
{
|
||||
if (pt.y != hint.y && first.x != pt.x)
|
||||
{
|
||||
// result.push(new mxPoint(pt.x, hint.y));
|
||||
if (horizontal) {
|
||||
if (pt.y != hint.y && first.x != pt.x) {
|
||||
console.log(hint.x,pt.y)
|
||||
result.push(new mxPoint(pt.x, hint.y));
|
||||
}
|
||||
}
|
||||
else if (pt.x != hint.x && first.y != pt.y)
|
||||
{
|
||||
// result.push(new mxPoint(hint.x, pt.y));
|
||||
else if (pt.x != hint.x && first.y != pt.y) {
|
||||
result.push(new mxPoint(hint.x, pt.y));
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
||||
mxStyleRegistry.putValue('wireEdgeStyle', mxEdgeStyle.WireConnector);
|
||||
|
||||
// This connector needs an mxEdgeSegmentHandler
|
||||
let mxGraphCreateHandler = mxGraph.prototype.createHandler;
|
||||
mxGraph.prototype.createHandler = function(state)
|
||||
{
|
||||
var result = null;
|
||||
|
||||
if (state != null)
|
||||
{
|
||||
if (this.model.isEdge(state.cell))
|
||||
{
|
||||
var style = this.view.getEdgeStyle(state);
|
||||
|
||||
if (style == mxEdgeStyle.WireConnector)
|
||||
{
|
||||
return new mxEdgeSegmentHandler(state);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return mxGraphCreateHandler.apply(this, arguments);
|
||||
};
|
||||
|
||||
mxGraphView.prototype.updateFixedTerminalPoint = function(edge, terminal, source, constraint)
|
||||
{
|
||||
mxLog.show()
|
||||
mxLog.debug("updateFixedTerminalPoint")
|
||||
var pt = null;
|
||||
if (constraint != null)
|
||||
{
|
||||
pt = this.graph.getConnectionPoint(terminal, constraint);
|
||||
}
|
||||
if (source)
|
||||
{
|
||||
edge.sourceSegment = null;
|
||||
}
|
||||
else
|
||||
{
|
||||
edge.targetSegment = null;
|
||||
}
|
||||
|
||||
if (pt == null)
|
||||
{
|
||||
var s = this.scale;
|
||||
var tr = this.translate;
|
||||
var orig = edge.origin;
|
||||
var geo = this.graph.getCellGeometry(edge.cell);
|
||||
pt = geo.getTerminalPoint(source);
|
||||
|
||||
// Computes edge-to-edge connection point
|
||||
if (pt != null)
|
||||
{
|
||||
pt = new mxPoint(s * (tr.x + pt.x + orig.x),
|
||||
s * (tr.y + pt.y + orig.y));
|
||||
|
||||
// Finds nearest segment on edge and computes intersection
|
||||
if (terminal != null && terminal.absolutePoints != null)
|
||||
{
|
||||
var seg = mxUtils.findNearestSegment(terminal, pt.x, pt.y);
|
||||
|
||||
// Finds orientation of the segment
|
||||
var p0 = terminal.absolutePoints[seg];
|
||||
var pe = terminal.absolutePoints[seg + 1];
|
||||
var horizontal = (p0.x - pe.x == 0);
|
||||
|
||||
// Stores the segment in the edge state
|
||||
var key = (source) ? 'sourceConstraint' : 'targetConstraint';
|
||||
var value = (horizontal) ? 'horizontal' : 'vertical';
|
||||
edge.style[key] = value;
|
||||
|
||||
// Keeps the coordinate within the segment bounds
|
||||
if (horizontal)
|
||||
{
|
||||
pt.x = p0.x;
|
||||
pt.y = Math.min(pt.y, Math.max(p0.y, pe.y));
|
||||
pt.y = Math.max(pt.y, Math.min(p0.y, pe.y));
|
||||
}
|
||||
else
|
||||
{
|
||||
pt.y = p0.y;
|
||||
pt.x = Math.min(pt.x, Math.max(p0.x, pe.x));
|
||||
pt.x = Math.max(pt.x, Math.min(p0.x, pe.x));
|
||||
}
|
||||
}
|
||||
}
|
||||
// Computes constraint connection points on vertices and ports
|
||||
else if (terminal != null && terminal.cell.geometry.relative)
|
||||
{
|
||||
pt = new mxPoint(this.getRoutingCenterX(terminal),
|
||||
this.getRoutingCenterY(terminal));
|
||||
}
|
||||
|
||||
// Snaps point to grid
|
||||
/*if (pt != null)
|
||||
{
|
||||
var tr = this.graph.view.translate;
|
||||
var s = this.graph.view.scale;
|
||||
|
||||
pt.x = (this.graph.snap(pt.x / s - tr.x) + tr.x) * s;
|
||||
pt.y = (this.graph.snap(pt.y / s - tr.y) + tr.y) * s;
|
||||
}*/
|
||||
}
|
||||
|
||||
edge.setAbsoluteTerminalPoint(pt, source);
|
||||
};
|
||||
|
||||
|
||||
let mxGraphGetCellStyle = mxGraph.prototype.getCellStyle;
|
||||
|
@ -282,6 +375,7 @@ class AltiumSchematicRenderer
|
|||
mxConnectionHandler.prototype.createEdgeState = function(me)
|
||||
{
|
||||
var edge = this.graph.createEdge();
|
||||
mxLog.debug("createEdgeState")
|
||||
|
||||
if (this.sourceConstraint != null && this.previous != null)
|
||||
{
|
||||
|
@ -310,6 +404,7 @@ class AltiumSchematicRenderer
|
|||
let mxConnectionHandlerUpdateCurrentState = mxConnectionHandler.prototype.updateCurrentState;
|
||||
mxConnectionHandler.prototype.updateCurrentState = function(me)
|
||||
{
|
||||
mxLog.debug('updateCurrentState')
|
||||
mxConnectionHandlerUpdateCurrentState.apply(this, arguments);
|
||||
|
||||
if (this.edgeState != null)
|
||||
|
@ -401,30 +496,30 @@ class AltiumSchematicRenderer
|
|||
return result;
|
||||
};
|
||||
// https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L1036
|
||||
mxGraphHandler.prototype.updatePreview = function(remote) {
|
||||
if (this.livePreviewUsed && !remote) {
|
||||
if (this.cells != null)
|
||||
{
|
||||
this.setHandlesVisibleForCells(this.graph.getSelectionCells(), false);
|
||||
this.updateLivePreview(this.currentDx, this.currentDy);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
this.updatePreviewShape();
|
||||
}
|
||||
};
|
||||
let oldMove = mxGraphHandler.prototype.mouseMove
|
||||
mxGraphHandler.prototype.mouseMove = function(sender, me){
|
||||
// mxLog.debug("mouse move",sender,me)
|
||||
// https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L901
|
||||
if (!this.livePreviewUsed && this.shape == null) {
|
||||
this.shape = this.createPreviewShape(this.bounds);
|
||||
}else if(this.shape != null){
|
||||
// mxLog.debug("mouseMove",this)
|
||||
}
|
||||
oldMove.call(this, sender, me);
|
||||
}
|
||||
// mxGraphHandler.prototype.updatePreview = function(remote) {
|
||||
// if (this.livePreviewUsed && !remote) {
|
||||
// if (this.cells != null)
|
||||
// {
|
||||
// this.setHandlesVisibleForCells(this.graph.getSelectionCells(), false);
|
||||
// this.updateLivePreview(this.currentDx, this.currentDy);
|
||||
// }
|
||||
// }
|
||||
// else
|
||||
// {
|
||||
// this.updatePreviewShape();
|
||||
// }
|
||||
// };
|
||||
// let oldMove = mxGraphHandler.prototype.mouseMove
|
||||
// mxGraphHandler.prototype.mouseMove = function(sender, me){
|
||||
// // mxLog.debug("mouse move",sender,me)
|
||||
// // https://github.com/jgraph/mxgraph/blob/master/javascript/src/js/handler/mxGraphHandler.js#L901
|
||||
// if (!this.livePreviewUsed && this.shape == null) {
|
||||
// this.shape = this.createPreviewShape(this.bounds);
|
||||
// }else if(this.shape != null){
|
||||
// // mxLog.debug("mouseMove",this)
|
||||
// }
|
||||
// oldMove.call(this, sender, me);
|
||||
// }
|
||||
|
||||
|
||||
let oldClick = mxGraphHandler.prototype.mouseDown
|
||||
|
@ -546,7 +641,9 @@ class AltiumSchematicRenderer
|
|||
}
|
||||
if((geo != null) && (this.getModel().isEdge(terminal.cell))) {
|
||||
console.log(terminal.cell)
|
||||
return [new mxConnectionConstraint(new mxPoint(0, 0), false)];
|
||||
if(terminal.cell.Wire == true)
|
||||
return [new mxConnectionConstraint(new mxPoint(1, 0), false),
|
||||
new mxConnectionConstraint(new mxPoint(0.75, 1), true)];
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
@ -567,13 +664,9 @@ class AltiumSchematicRenderer
|
|||
|
||||
|
||||
var parent = this.graph.getDefaultParent();
|
||||
mxVertexHandler.prototype.livePreview = true;
|
||||
|
||||
var labelBackground = (false) ? '#000000' : '#FFFFFF';
|
||||
var fontColor = (false) ? '#FFFFFF' : '#000000';
|
||||
var strokeColor = (false) ? '#C0C0C0' : '#000000';
|
||||
var fillColor = (false) ? 'none' : '#FFFFFF';
|
||||
|
||||
|
||||
var style = this.graph.getStylesheet().getDefaultEdgeStyle();
|
||||
delete style['endArrow'];
|
||||
|
@ -606,77 +699,17 @@ class AltiumSchematicRenderer
|
|||
let doc = this.document;
|
||||
|
||||
let sheetObject = doc.objects.find(o => o instanceof AltiumSheet);
|
||||
|
||||
// canvas.style.width = sheetObject.width + "px";
|
||||
// canvas.style.height = sheetObject.height + "px";
|
||||
// canvas.width = sheetObject.width * window.devicePixelRatio;
|
||||
// canvas.height = sheetObject.height * window.devicePixelRatio;
|
||||
let areaColourInt = Number.parseInt(sheetObject.attributes.areacolor, 10);
|
||||
let areaColour = this.#altiumColourToHex(areaColourInt);
|
||||
// canvas.style.backgroundColor = areaColour;
|
||||
// let ctx = canvas.getContext('2d');
|
||||
// ctx.scale(1, -1);
|
||||
// ctx.translate(0.5, 0.5);
|
||||
// ctx.translate(0, -canvas.height);
|
||||
// ctx.font = "7pt sans-serif";
|
||||
// ctx.textRendering = "optimizeLegibility";
|
||||
// ctx.imageSmoothingQuality = "high";
|
||||
// ctx.textBaseline = "bottom";
|
||||
// ctx.fillStyle = areaColour;
|
||||
// ctx.fillRect(0, 0, canvas.width, canvas.height);
|
||||
|
||||
let results = document.getElementById("results");
|
||||
|
||||
let sheet = doc.objects.find((o) => o instanceof AltiumSheet);
|
||||
let gridLight = "#eeeeee";
|
||||
let gridDark = "#cccccc";
|
||||
// ctx.lineWidth = 1;
|
||||
// ctx.globalAlpha = 0.5;
|
||||
if (sheet.show_grid)
|
||||
{
|
||||
|
||||
let n = 0;
|
||||
// for (let x = 0; x < canvas.width; x += sheet.grid_size)
|
||||
// {
|
||||
// ctx.strokeStyle = ((n % 10) == 0) ? gridDark : gridLight;
|
||||
// ctx.beginPath();
|
||||
// ctx.moveTo(x, 0);
|
||||
// ctx.lineTo(x, canvas.height);
|
||||
// ctx.stroke();
|
||||
// n++;
|
||||
// }
|
||||
// n = 0;
|
||||
// for (let y = 0; y < canvas.height; y += sheet.grid_size)
|
||||
// {
|
||||
// ctx.strokeStyle = ((n % 10) == 0) ? gridDark : gridLight;
|
||||
// ctx.beginPath();
|
||||
// ctx.moveTo(0, y);
|
||||
// ctx.lineTo(canvas.width, y);
|
||||
// ctx.stroke();
|
||||
// n++;
|
||||
// }
|
||||
if (sheet.show_grid) {
|
||||
|
||||
}
|
||||
// ctx.globalAlpha = 1;
|
||||
|
||||
/*
|
||||
|
||||
ctx.textAlign = "center";
|
||||
ctx.font = "bold 100px serif";
|
||||
ctx.fillStyle = "#333300";
|
||||
ctx.globalAlpha = 0.03;
|
||||
ctx.save();
|
||||
|
||||
ctx.rotate(Math.PI/4);
|
||||
ctx.scale(1,-1);
|
||||
for (let y = 0; y < canvas.height * 2; y += 400)
|
||||
{
|
||||
ctx.fillText("PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA", canvas.width / 2, canvas.height - (y + 200));
|
||||
ctx.fillText("BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW - BETA - PREVIEW", canvas.width / 2, canvas.height - y);
|
||||
}
|
||||
|
||||
ctx.textAlign = "left";
|
||||
*/
|
||||
|
||||
this.graph.getModel().beginUpdate();
|
||||
try{
|
||||
let bom = [];
|
||||
|
@ -694,11 +727,8 @@ class AltiumSchematicRenderer
|
|||
bom.push(bomLine);
|
||||
}
|
||||
//bomLine += obj.description;
|
||||
|
||||
}
|
||||
results.innerText = bom.join("\n");
|
||||
|
||||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumBus))
|
||||
{
|
||||
// if (!this.#shouldShow(obj)) continue;
|
||||
|
@ -713,7 +743,6 @@ class AltiumSchematicRenderer
|
|||
// }
|
||||
// ctx.stroke();
|
||||
}
|
||||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetSymbol))
|
||||
{
|
||||
// if (!this.#shouldShow(obj)) continue;
|
||||
|
@ -748,8 +777,7 @@ class AltiumSchematicRenderer
|
|||
// ctx.stroke();
|
||||
}
|
||||
let chips = {}
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumRectangle))
|
||||
{
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumRectangle)) {
|
||||
obj.top = 840 - obj.top
|
||||
obj.bottom = 840 - obj.bottom
|
||||
if(!obj.transparent){
|
||||
|
@ -784,8 +812,7 @@ class AltiumSchematicRenderer
|
|||
}
|
||||
|
||||
// todo undo
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry))
|
||||
{
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry)) {
|
||||
if (!this.#shouldShow(obj)) continue;
|
||||
|
||||
// ctx.strokeStyle = this.#altiumColourToHex(obj.colour);
|
||||
|
@ -820,7 +847,7 @@ class AltiumSchematicRenderer
|
|||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumPin))
|
||||
{
|
||||
var style = 'shape=line;fontColor=#000000;strokeColor=#000000;'
|
||||
var style = 'shape=line;fontColor=#000000;strokeColor=#000000;routingCenterX=-0.5;portConstraint=horizontal;'
|
||||
let name = ''
|
||||
if(obj.show_name){
|
||||
name = obj.name
|
||||
|
@ -1168,8 +1195,6 @@ class AltiumSchematicRenderer
|
|||
// ctx.fillText(obj.text, obj.x, canvas.height - obj.y);
|
||||
// }
|
||||
}
|
||||
// ctx.textAlign = "left";
|
||||
// ctx.textBaseline = "bottom";
|
||||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumNetLabel)) {
|
||||
obj = obj
|
||||
|
@ -1201,12 +1226,6 @@ class AltiumSchematicRenderer
|
|||
// ctx.fillText(obj.text, obj.x, canvas.height - obj.y);
|
||||
// }
|
||||
}
|
||||
// ctx.textAlign = "left";
|
||||
// ctx.textBaseline = "bottom";
|
||||
|
||||
|
||||
// ctx.textAlign = "left";
|
||||
// ctx.textBaseline = "bottom";
|
||||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumPowerPort)) {
|
||||
obj = obj
|
||||
|
@ -1320,6 +1339,7 @@ class AltiumSchematicRenderer
|
|||
e6.geometry.setTerminalPoint(new mxPoint(obj.points[0].x, obj.points[0].y), true)
|
||||
e6.geometry.setTerminalPoint(new mxPoint(obj.points[obj.points.length - 1].x,
|
||||
obj.points[obj.points.length - 1].y), false)
|
||||
e6.Wire = true
|
||||
|
||||
if(this.wires == undefined){
|
||||
this.wires = []
|
||||
|
|
Loading…
Reference in New Issue