完成 wire和pin和AltiumRectangle
parent
19bfec247c
commit
9e95cd3e62
|
|
@ -25,7 +25,7 @@ style="overflow:auto;position:relative;width:1500px;height:600px;border:1px soli
|
|||
// renderSchematic(getTestFile());
|
||||
|
||||
function readSchematicFile(e) {
|
||||
console.log(e)
|
||||
// console.log(e)
|
||||
let file = e.target.files[0];
|
||||
if (!file)
|
||||
{
|
||||
|
|
@ -36,7 +36,7 @@ function readSchematicFile(e) {
|
|||
{
|
||||
let contents = e.target.result;
|
||||
let cfbs = window.cfb
|
||||
console.log(contents)
|
||||
// console.log(contents)
|
||||
var dec = new TextDecoder("utf-8");
|
||||
|
||||
let arr = Array.prototype.slice.call(new Uint8Array(contents ));
|
||||
|
|
|
|||
|
|
@ -697,7 +697,7 @@ class AltiumDocument
|
|||
this.stream = new U8Stream(streams);
|
||||
this.records = [];
|
||||
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)
|
||||
{
|
||||
this.records.push(new AltiumRecord(this.stream, index));
|
||||
|
|
|
|||
|
|
@ -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.
|
||||
|
||||
*/
|
||||
|
||||
mxConnectionHandler.prototype.movePreviewAway = false;
|
||||
mxConnectionHandler.prototype.waypointsEnabled = true;
|
||||
mxGraph.prototype.resetEdgesOnConnect = false;
|
||||
mxConstants.SHADOWCOLOR = '#C0C0C0';
|
||||
var joinNodeSize = 7;
|
||||
var strokeWidth = 2;
|
||||
|
||||
class AltiumSchematicRenderer
|
||||
{
|
||||
|
|
@ -32,6 +37,7 @@ class AltiumSchematicRenderer
|
|||
{
|
||||
this.canvas = canvas;
|
||||
this.document = document;
|
||||
this.graph = null
|
||||
}
|
||||
|
||||
#altiumColourToHex(colourInt)
|
||||
|
|
@ -54,34 +60,36 @@ class AltiumSchematicRenderer
|
|||
return parent.current_part_id == object.owner_part_id;
|
||||
}
|
||||
|
||||
render() {
|
||||
let graph = new mxGraph(document.getElementById('graphContainer'));
|
||||
graph.setPanning(true);
|
||||
graph.setConnectable(true);
|
||||
graph.setConnectableEdges(true);
|
||||
graph.setDisconnectOnMove(false);
|
||||
graph.foldingEnabled = false;
|
||||
initGraph() {
|
||||
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;
|
||||
|
||||
//Maximum size
|
||||
graph.maximumGraphBounds = new mxRectangle(0, 0, 800, 600)
|
||||
graph.border = 50;
|
||||
this.graph.maximumGraphBounds = new mxRectangle(0, 0, 1400, 600)
|
||||
this.graph.border = 0;
|
||||
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.
|
||||
graph.panningHandler.isPopupTrigger = function() { return false; };
|
||||
this.graph.panningHandler.isPopupTrigger = function() { return false; };
|
||||
|
||||
// Enables return key to stop editing (use shift-enter for newlines)
|
||||
graph.setEnterStopsCellEditing(true);
|
||||
this.graph.setEnterStopsCellEditing(true);
|
||||
|
||||
// Adds rubberband selection
|
||||
new mxRubberband(graph);
|
||||
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.
|
||||
graph.getAllConnectionConstraints = function(terminal) {
|
||||
this.graph.getAllConnectionConstraints = function(terminal) {
|
||||
var geo = (terminal != null) ? this.getCellGeometry(terminal.cell) : null;
|
||||
console.log("getAllConnectionConstraints ")
|
||||
if ((geo != null ? !geo.relative : false) &&
|
||||
|
|
@ -96,7 +104,7 @@ class AltiumSchematicRenderer
|
|||
};
|
||||
|
||||
// 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)
|
||||
if (this.graph.getModel().isEdge(cell))
|
||||
{
|
||||
|
|
@ -109,30 +117,137 @@ class AltiumSchematicRenderer
|
|||
return (geo != null) ? geo.relative : false;
|
||||
}
|
||||
};
|
||||
var parent = graph.getDefaultParent();
|
||||
|
||||
graph.getModel().beginUpdate();
|
||||
try
|
||||
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;
|
||||
|
||||
}
|
||||
|
||||
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,
|
||||
'verticalLabelPosition=top;verticalAlign=bottom;shadow=1;fillColor=' + fillColor);
|
||||
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 [new mxConnectionConstraint(new mxPoint(0, 0.5), false),
|
||||
new mxConnectionConstraint(new mxPoint(1, 0.5), false)];
|
||||
}
|
||||
|
||||
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 doc = this.document;
|
||||
|
||||
|
|
@ -208,6 +323,8 @@ class AltiumSchematicRenderer
|
|||
ctx.textAlign = "left";
|
||||
*/
|
||||
|
||||
this.graph.getModel().beginUpdate();
|
||||
try{
|
||||
let bom = [];
|
||||
bom.push("\"designator\", \"part\", \"description\"");
|
||||
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 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;
|
||||
|
||||
// ctx.strokeStyle = this.#altiumColourToHex(obj.colour);
|
||||
|
|
@ -289,8 +415,23 @@ class AltiumSchematicRenderer
|
|||
// }
|
||||
// ctx.stroke();
|
||||
}
|
||||
|
||||
var v1
|
||||
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))
|
||||
// continue;
|
||||
// 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);
|
||||
|
||||
}
|
||||
|
||||
// todo undo
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumSheetEntry))
|
||||
{
|
||||
|
|
@ -354,12 +496,33 @@ class AltiumSchematicRenderer
|
|||
// if (!obj.transparent)
|
||||
// ctx.fill();
|
||||
}
|
||||
|
||||
console.log(doc.objects)
|
||||
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.moveTo(obj.x, obj.y);
|
||||
// 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();
|
||||
}
|
||||
|
||||
|
||||
for (let obj of doc.objects.filter((o) => o instanceof AltiumLine))
|
||||
{
|
||||
|
||||
// if (!this.#shouldShow(obj)) continue;
|
||||
|
||||
// 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.textAlign = "left";
|
||||
|
|
|
|||
Loading…
Reference in New Issue