完成 wire和pin和AltiumRectangle

main
zcy 2024-03-02 09:40:02 +08:00
parent 19bfec247c
commit 9e95cd3e62
3 changed files with 951 additions and 738 deletions

View File

@ -25,7 +25,7 @@ style="overflow:auto;position:relative;width:1500px;height:600px;border:1px soli
// renderSchematic(getTestFile()); // renderSchematic(getTestFile());
function readSchematicFile(e) { function readSchematicFile(e) {
console.log(e) // console.log(e)
let file = e.target.files[0]; let file = e.target.files[0];
if (!file) if (!file)
{ {
@ -36,7 +36,7 @@ function readSchematicFile(e) {
{ {
let contents = e.target.result; let contents = e.target.result;
let cfbs = window.cfb let cfbs = window.cfb
console.log(contents) // console.log(contents)
var dec = new TextDecoder("utf-8"); var dec = new TextDecoder("utf-8");
let arr = Array.prototype.slice.call(new Uint8Array(contents )); let arr = Array.prototype.slice.call(new Uint8Array(contents ));

View File

@ -697,7 +697,7 @@ class AltiumDocument
this.stream = new U8Stream(streams); this.stream = new U8Stream(streams);
this.records = []; this.records = [];
let index = -1; // header comes first, so give it an index of -1 let index = -1; // header comes first, so give it an index of -1
console.log(this.stream.length) // console.log(this.stream.length)
while (this.stream.u8stream_position < this.stream.length) while (this.stream.u8stream_position < this.stream.length)
{ {
this.records.push(new AltiumRecord(this.stream, index)); this.records.push(new AltiumRecord(this.stream, index));

View File

@ -24,7 +24,12 @@ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/ */
mxConnectionHandler.prototype.movePreviewAway = false;
mxConnectionHandler.prototype.waypointsEnabled = true;
mxGraph.prototype.resetEdgesOnConnect = false;
mxConstants.SHADOWCOLOR = '#C0C0C0';
var joinNodeSize = 7;
var strokeWidth = 2;
class AltiumSchematicRenderer class AltiumSchematicRenderer
{ {
@ -32,6 +37,7 @@ class AltiumSchematicRenderer
{ {
this.canvas = canvas; this.canvas = canvas;
this.document = document; this.document = document;
this.graph = null
} }
#altiumColourToHex(colourInt) #altiumColourToHex(colourInt)
@ -54,34 +60,36 @@ class AltiumSchematicRenderer
return parent.current_part_id == object.owner_part_id; return parent.current_part_id == object.owner_part_id;
} }
render() { initGraph() {
let graph = new mxGraph(document.getElementById('graphContainer')); this.graph = new mxGraph(document.getElementById('graphContainer'));
graph.setPanning(true); this.graph.setPanning(true);
graph.setConnectable(true); this.graph.setConnectable(true);
graph.setConnectableEdges(true); this.graph.setConnectableEdges(true);
graph.setDisconnectOnMove(false); this.graph.setDisconnectOnMove(false);
graph.foldingEnabled = false; this.graph.foldingEnabled = false;
//Maximum size //Maximum size
graph.maximumGraphBounds = new mxRectangle(0, 0, 800, 600) this.graph.maximumGraphBounds = new mxRectangle(0, 0, 1400, 600)
graph.border = 50; this.graph.border = 0;
var fontColor = '#FFFFFF' ; var fontColor = '#FFFFFF' ;
var strokeColor = '#C0C0C0' ; var strokeColor = '#C0C0C0' ;
var fillColor = '#C0C0C0'; var fillColor = '#C0C0C0';
// Panning handler consumed right click so this must be // Panning handler consumed right click so this must be
// disabled if right click should stop connection handler. // disabled if right click should stop connection handler.
graph.panningHandler.isPopupTrigger = function() { return false; }; this.graph.panningHandler.isPopupTrigger = function() { return false; };
// Enables return key to stop editing (use shift-enter for newlines) // Enables return key to stop editing (use shift-enter for newlines)
graph.setEnterStopsCellEditing(true); this.graph.setEnterStopsCellEditing(true);
// Adds rubberband selection // Adds rubberband selection
new mxRubberband(graph); new mxRubberband(this.graph);
mxVertexHandler.prototype.rotationEnabled = true;
// Alternative solution for implementing connection points without child cells. // Alternative solution for implementing connection points without child cells.
// This can be extended as shown in portrefs.html example to allow for per-port // This can be extended as shown in portrefs.html example to allow for per-port
// incoming/outgoing direction. // incoming/outgoing direction.
graph.getAllConnectionConstraints = function(terminal) { this.graph.getAllConnectionConstraints = function(terminal) {
var geo = (terminal != null) ? this.getCellGeometry(terminal.cell) : null; var geo = (terminal != null) ? this.getCellGeometry(terminal.cell) : null;
console.log("getAllConnectionConstraints ") console.log("getAllConnectionConstraints ")
if ((geo != null ? !geo.relative : false) && if ((geo != null ? !geo.relative : false) &&
@ -96,7 +104,7 @@ class AltiumSchematicRenderer
}; };
// Makes sure non-relative cells can only be connected via constraints // Makes sure non-relative cells can only be connected via constraints
graph.connectionHandler.isConnectableCell = function(cell) { this.graph.connectionHandler.isConnectableCell = function(cell) {
console.log("isConnectableCell",cell) console.log("isConnectableCell",cell)
if (this.graph.getModel().isEdge(cell)) if (this.graph.getModel().isEdge(cell))
{ {
@ -109,30 +117,137 @@ class AltiumSchematicRenderer
return (geo != null) ? geo.relative : false; return (geo != null) ? geo.relative : false;
} }
}; };
var parent = graph.getDefaultParent();
graph.getModel().beginUpdate(); var parent = this.graph.getDefaultParent();
try mxVertexHandler.prototype.livePreview = true;
mxVertexHandler.prototype.rotationEnabled = 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'];
style['strokeColor'] = strokeColor;
style['labelBackgroundColor'] = labelBackground;
style['edgeStyle'] = 'wireEdgeStyle';
style['fontColor'] = fontColor;
style['fontSize'] = '9';
style['movable'] = '0';
style['strokeWidth'] = strokeWidth;
style['rounded'] = '0';
// Sets join node size
style['startSize'] = joinNodeSize;
style['endSize'] = joinNodeSize;
style = this.graph.getStylesheet().getDefaultVertexStyle();
//style['gradientColor'] = '#909090';
style['strokeColor'] = strokeColor;
//style['fillColor'] = '#e0e0e0';
style['fillColor'] = 'none';
style['fontColor'] = fontColor;
style['fontStyle'] = '1';
style['fontSize'] = '12';
style['resizable'] = '0';
style['strokeWidth'] = strokeWidth;
}
render() {
this.graph = new mxGraph(document.getElementById('graphContainer'));
this.graph.setPanning(true);
this.graph.setConnectable(true);
this.graph.setConnectableEdges(true);
this.graph.setDisconnectOnMove(false);
this.graph.foldingEnabled = false;
this.graph.gridSize = 1
//Maximum size
this.graph.maximumGraphBounds = new mxRectangle(0, 0, 1920, 800)
this.graph.border = 20;
var fontColor = '#FFFFFF' ;
var strokeColor = '#C0C0C0' ;
var fillColor = '#C0C0C0';
// Panning handler consumed right click so this must be
// disabled if right click should stop connection handler.
this.graph.panningHandler.isPopupTrigger = function() { return false; };
// Enables return key to stop editing (use shift-enter for newlines)
this.graph.setEnterStopsCellEditing(true);
// Adds rubberband selection
new mxRubberband(this.graph);
mxVertexHandler.prototype.rotationEnabled = true;
// Alternative solution for implementing connection points without child cells.
// This can be extended as shown in portrefs.html example to allow for per-port
// incoming/outgoing direction.
this.graph.getAllConnectionConstraints = function(terminal) {
var geo = (terminal != null) ? this.getCellGeometry(terminal.cell) : null;
console.log("getAllConnectionConstraints ")
if ((geo != null ? !geo.relative : false) &&
this.getModel().isVertex(terminal.cell) &&
this.getModel().getChildCount(terminal.cell) == 0)
{ {
var v1 = graph.insertVertex(parent, null, 'J1', 80, 40, 40, 80, return [new mxConnectionConstraint(new mxPoint(0, 0.5), false),
'verticalLabelPosition=top;verticalAlign=bottom;shadow=1;fillColor=' + fillColor); new mxConnectionConstraint(new mxPoint(1, 0.5), false)];
v1.setConnectable(false);
var v11 = graph.insertVertex(v1, null, '1', 0, 0, 10, 16,
'shape=line;align=left;verticalAlign=middle;fontSize=10;routingCenterX=-0.5;'+
'spacingLeft=12;fontColor=' + fontColor + ';strokeColor=' + strokeColor);
v11.geometry.relative = true;
v11.geometry.offset = new mxPoint(-v11.geometry.width, 2);
var v12 = v11.clone();
v12.value = '2';
v12.geometry.offset = new mxPoint(-v11.geometry.width, 22);
v1.insert(v12);
}
finally{
graph.getModel().endUpdate();
} }
return null;
};
// Makes sure non-relative cells can only be connected via constraints
this.graph.connectionHandler.isConnectableCell = function(cell) {
if (this.graph.getModel().isEdge(cell))
{
return true;
}
else
{
var geo = (cell != null) ? this.graph.getCellGeometry(cell) : null;
return (geo != null) ? geo.relative : false;
}
};
var parent = this.graph.getDefaultParent();
mxVertexHandler.prototype.livePreview = true;
mxVertexHandler.prototype.rotationEnabled = 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'];
style['strokeColor'] = strokeColor;
style['labelBackgroundColor'] = labelBackground;
style['edgeStyle'] = 'wireEdgeStyle';
style['fontColor'] = fontColor;
style['fontSize'] = '9';
style['movable'] = '0';
style['strokeWidth'] = strokeWidth;
style['rounded'] = '0';
// Sets join node size
style['startSize'] = joinNodeSize;
style['endSize'] = joinNodeSize;
style = this.graph.getStylesheet().getDefaultVertexStyle();
//style['gradientColor'] = '#909090';
style['strokeColor'] = strokeColor;
//style['fillColor'] = '#e0e0e0';
style['fillColor'] = 'none';
style['fontColor'] = fontColor;
style['fontStyle'] = '1';
style['fontSize'] = '12';
style['resizable'] = '0';
style['strokeWidth'] = strokeWidth;
// let canvas = this.canvas; // let canvas = this.canvas;
let doc = this.document; let doc = this.document;
@ -208,6 +323,8 @@ class AltiumSchematicRenderer
ctx.textAlign = "left"; ctx.textAlign = "left";
*/ */
this.graph.getModel().beginUpdate();
try{
let bom = []; let bom = [];
bom.push("\"designator\", \"part\", \"description\""); bom.push("\"designator\", \"part\", \"description\"");
for (let obj of doc.objects.filter((o) => o instanceof AltiumDesignator)) for (let obj of doc.objects.filter((o) => o instanceof AltiumDesignator))
@ -229,6 +346,15 @@ class AltiumSchematicRenderer
for (let obj of doc.objects.filter((o) => o instanceof AltiumWire)) for (let obj of doc.objects.filter((o) => o instanceof AltiumWire))
{ {
// for (let i = 1; i < obj.points.length; i++)
// {
// obj.points[i].y = 840 - obj.points[i].y
// }
var obj1 = this.graph.getCellAt(obj.points[0].x,obj.points[0].y,parent)
var obj2 = this.graph.getCellAt(obj.points[obj.points.length - 1].x,
obj.points[obj.points.length - 1].y,parent)
console.log(obj1,obj2)
// if (!this.#shouldShow(obj)) continue; // if (!this.#shouldShow(obj)) continue;
// ctx.strokeStyle = this.#altiumColourToHex(obj.colour); // ctx.strokeStyle = this.#altiumColourToHex(obj.colour);
@ -289,8 +415,23 @@ class AltiumSchematicRenderer
// } // }
// ctx.stroke(); // ctx.stroke();
} }
var v1
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
console.log('verticalLabelPosition=top;verticalAlign=bottom;fillColor='
+ this.#altiumColourToHex(obj.attributes.areacolor))
v1 = this.graph.insertVertex(parent, null, '',
obj.left, obj.top,
(obj.right - obj.left),
(obj.bottom - obj.top),
'verticalLabelPosition=top;verticalAlign=bottom;fillColor='
+ this.#altiumColourToHex(obj.attributes.areacolor));
v1.setConnectable(false);
// if (!this.#shouldShow(obj)) // if (!this.#shouldShow(obj))
// continue; // continue;
// ctx.fillStyle = this.#altiumColourToHex(obj.attributes.areacolor); // ctx.fillStyle = this.#altiumColourToHex(obj.attributes.areacolor);
@ -305,6 +446,7 @@ class AltiumSchematicRenderer
// obj.attributes.corner_x - obj.attributes.location_x, obj.attributes.corner_y - obj.attributes.location_y); // obj.attributes.corner_x - obj.attributes.location_x, obj.attributes.corner_y - obj.attributes.location_y);
} }
// todo undo // todo undo
for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry)) for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry))
{ {
@ -354,12 +496,33 @@ class AltiumSchematicRenderer
// if (!obj.transparent) // if (!obj.transparent)
// ctx.fill(); // ctx.fill();
} }
console.log(doc.objects)
for (let obj of doc.objects.filter((o) => o instanceof AltiumPin)) for (let obj of doc.objects.filter((o) => o instanceof AltiumPin))
{ {
// if (!this.#shouldShow(obj)) continue; var style = 'shape=line;fontColor=#000000;strokeColor=#000000;'
if(obj.angle == 90){
style += 'rotation=90'
obj.y = obj.y + obj.length/2
obj.x = obj.x - obj.length/2
}
if(obj.angle == 180){
obj.x = obj.x - obj.length
}
if(obj.angle == 270){
style += 'rotation=90'
obj.y = obj.y - obj.length/2
obj.x = obj.x - obj.length/2
// ctx.strokeStyle = "#000000"; }
obj.y = 840 - obj.y
// console.log(style)
var v11 = this.graph.insertVertex(parent, null, '', obj.x, obj.y,
obj.length, 1,
style);
v11.geometry.relative = false;
v11.setConnectable(true);
// v11.geometry.offset = new mxPoint(-v11.geometry.width, 2); // ctx.strokeStyle = "#000000";
// ctx.beginPath(); // ctx.beginPath();
// ctx.moveTo(obj.x, obj.y); // ctx.moveTo(obj.x, obj.y);
// ctx.lineTo(obj.x + obj.angle_vec[0] * obj.length, obj.y + obj.angle_vec[1] * obj.length); // ctx.lineTo(obj.x + obj.angle_vec[0] * obj.length, obj.y + obj.angle_vec[1] * obj.length);
@ -371,8 +534,10 @@ class AltiumSchematicRenderer
// ctx.fill(); // ctx.fill();
} }
for (let obj of doc.objects.filter((o) => o instanceof AltiumLine)) for (let obj of doc.objects.filter((o) => o instanceof AltiumLine))
{ {
// if (!this.#shouldShow(obj)) continue; // if (!this.#shouldShow(obj)) continue;
// ctx.strokeStyle = this.#altiumColourToHex(obj.colour); // ctx.strokeStyle = this.#altiumColourToHex(obj.colour);
@ -885,6 +1050,54 @@ class AltiumSchematicRenderer
// } // }
// } // }
} }
for (let obj of doc.objects.filter((o) => o instanceof AltiumWire))
{
let poi = []
for (let i = 0; i < obj.points.length; i++) {
obj.points[i].y = 840 - obj.points[i].y
if((i != 0) &&(i != obj.points.length)){
poi.push(new mxPoint(obj.points[i].x , obj.points[i].y))
}
}
var e6 = this.graph.insertEdge(parent, null, '')
e6.geometry.points = poi
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)
var obj1 = this.graph.getCellAt(obj.points[0].x,obj.points[0].y,parent)
var obj2 = this.graph.getCellAt(obj.points[obj.points.length - 1].x,
obj.points[obj.points.length - 1].y,parent)
for (let i in this.graph.model.cells){
if(this.graph.model.cells[i].geometry != undefined){
//
if((this.graph.model.cells[i].geometry['x'] == obj.points[0].x)
&&(this.graph.model.cells[i].geometry['y'] == obj.points[0].y)){
console.log("find first")
console.log(this.graph.model.cells[i].geometry)
}
}
}
// if (!this.#shouldShow(obj)) continue;
// ctx.strokeStyle = this.#altiumColourToHex(obj.colour);
// ctx.lineWidth = obj.width;
// ctx.beginPath();
// ctx.moveTo(obj.points[0].x, obj.points[0].y);
// for (let i = 1; i < obj.points.length; i++)
// {
// ctx.lineTo(obj.points[i].x, obj.points[i].y);
// }
// ctx.stroke();
}
}
finally{
this.graph.getModel().endUpdate();
}
// ctx.font = savedFont; // ctx.font = savedFont;
// ctx.textAlign = "left"; // ctx.textAlign = "left";