Use SVG DOM to highlight nodes

This commit is contained in:
trebonian 2012-02-03 21:42:34 -05:00
parent ae185ff06b
commit 050906f305
2 changed files with 42 additions and 12 deletions

View File

@ -144,12 +144,19 @@ function mouseUp(e){
} }
function setZoom(n){ function setZoom(n){
var svg = chipbg.getSVGDocument();
svg = svg.childNodes[0];
zoom = n; zoom = n;
setChipStyle({ setChipStyle({
width: 600*n+'px', width: 600*n+'px',
height: 600*n+'px' height: 600*n+'px'
}); });
svg.style.width = 600*n+'px';
svg.style.height = 600*n+'px';
recenter(); recenter();
} }
function recenter(){ function recenter(){
@ -193,7 +200,7 @@ function handleClick(e){
function setChipStyle(props){ function setChipStyle(props){
for(var i in props){ for(var i in props){
chipbg.style[i] = props[i]; chipbg.style[i] = props[i];
overlay.style[i] = props[i]; // overlay.style[i] = props[i];
hilite.style[i] = props[i]; hilite.style[i] = props[i];
hitbuffer.style[i] = props[i]; hitbuffer.style[i] = props[i];
} }

View File

@ -94,10 +94,10 @@ function setupBackground(){
} }
function setupOverlay(){ function setupOverlay(){
overlay = document.getElementById('overlay'); // overlay = document.getElementById('overlay');
overlay.width = grCanvasSize; // overlay.width = grCanvasSize;
overlay.height = grCanvasSize; // overlay.height = grCanvasSize;
ctx = overlay.getContext('2d'); // ctx = overlay.getContext('2d');
} }
function setupHilite(){ function setupHilite(){
@ -137,21 +137,44 @@ function hexdigit(n){return '0123456789ABCDEF'.charAt(n);}
///////////////////////// /////////////////////////
function refresh(){ function refresh(){
var svg = chipbg.getSVGDocument();
svg = svg.childNodes[0];
var poly = svg.getElementById('poly');
var metal = svg.getElementById('metal');
var polyOffFill = poly.getAttribute('fill');
var metalOffFill = metal.getAttribute('fill');
if(!chipLayoutIsVisible) return; if(!chipLayoutIsVisible) return;
// ctx.clearRect(0,0,grCanvasSize,grCanvasSize); // ctx.clearRect(0,0,grCanvasSize,grCanvasSize);
// for(i in nodes){ // for(i in nodes){
// if(isNodeHigh(i)) overlayNode(nodes[i].segs); // if(isNodeHigh(i)) overlayNode(nodes[i].segs);
// } // }
for(i in nodes){
var n = poly.getElementsByClassName(i+'')[0];
var n2 = metal.getElementsByClassName(i+'')[0];
if(isNodeHigh(i)){
if(n!=undefined)
n.setAttribute('fill', 'rgb(0,255,255)');
if(n2!=undefined)
n2.setAttribute('fill', 'rgb(0,255,255)');
} else {
if(n!=undefined)
n.setAttribute('fill', polyOffFill);
if(n2!=undefined)
n2.setAttribute('fill', metalOffFill);
}
}
hiliteNode(hilited); hiliteNode(hilited);
} }
function overlayNode(w){ //function overlayNode(w){
ctx.fillStyle = 'rgba(255,0,64,0.4)'; // ctx.fillStyle = 'rgba(255,0,64,0.4)';
for(i in w) { // for(i in w) {
drawSeg(ctx, w[i]); // drawSeg(ctx, w[i]);
ctx.fill(); // ctx.fill();
} // }
} //}
// originally to highlight using a list of node numbers // originally to highlight using a list of node numbers
// but can now include transistor names // but can now include transistor names