Revision: 505
Author:
ryandesign.com
Date: Tue Sep 24 05:59:15 2013 UTC
Log: fix xdot background polygon coordinates; improve handling of
xdotversion 1.0
http://code.google.com/p/canviz/source/detail?r=505
Modified:
/canviz/trunk/HISTORY.md
/canviz/trunk/src/Canviz.js
/canviz/trunk/src/Entity.js
=======================================
--- /canviz/trunk/HISTORY.md Fri Sep 20 06:27:19 2013 UTC
+++ /canviz/trunk/HISTORY.md Tue Sep 24 05:59:15 2013 UTC
@@ -13,12 +13,13 @@
* Convert documentation files to Markdown format
* Add a test suite
* Implement alternate text rendering using the canvas (instead of overlay
spans)
-* Improve text positioning
+* Improve text positioning, working around some xdot bugs
* Handle the graph "margin", "pad" and "size" attributes correctly
* Handle the graph "landscape", "orientation" and "rotate" attributes
correctly
* Handle graphs rendered with the Graphviz "-y" switch
* Handle xdotversion up to 1.6
-* Handle gradients
+* Fix errors when rendering xdotversion 1.0
+* Handle gradients, working around some xdot bugs
* Handle bold, italic, underline, strikethrough, subscript and superscript
text styles
* Fix bug when fill and stroke color are the same which had resulted in
edge arrows appearing slightly too small and table horizontal and vertical
rules not getting drawn at all
* Create xdot2png command-line script
=======================================
--- /canviz/trunk/src/Canviz.js Fri Sep 20 08:58:37 2013 UTC
+++ /canviz/trunk/src/Canviz.js Tue Sep 24 05:59:15 2013 UTC
@@ -104,8 +104,7 @@
this.images = {};
this.paddingX = this.paddingY = XDOT_DPI * 0.0555;
this.dpi = 96;
- this.bgcolor = {opacity: 1};
- this.bgcolor.canvasColor = this.bgcolor.textColor = '#ffffff';
+ var bgColor = 'white';
var bbEnlarge = this.rotate = 0; // false
var containers = [];
var lines = xdot.split(/\r?\n/);
@@ -212,7 +211,7 @@
this.invertY = attrValue[3] > 0;
break;
case 'bgcolor':
- this.bgcolor = rootGraph.parseColor(attrValue);
+ bgColor = attrValue;
break;
case 'dpi':
this.dpi = attrValue;
@@ -260,8 +259,29 @@
}
}
}
+ function xdotRound(n) {
+ var digits = 2;
+ var mult = Math.pow(10, digits);
+ return Math.round(mult * n) / mult;
+ }
var drawingWidth = this.width + 2 * this.paddingX;
var drawingHeight = this.height + 2 * this.paddingY;
+ // Fix incorrect background polygon coordinates which don't include the
+ // padding, and set the stroke color to fully transparent.
+ //
http://graphviz.org/mantisbt/view.php?id=2372
+ var left = xdotRound(-this.paddingX);
+ var bottom = xdotRound(-this.paddingY);
+ var right = xdotRound(this.width + this.paddingX);
+ var top = xdotRound(this.height + this.paddingY);
+ rootGraph.drawAttrs['_draw_'] = [
+ 'C', bgColor.length + ' -' + bgColor,
+ (rootGraph.drawAttrs['_draw_'] || '').replace(/P 4(
-?[0-9.]+){8}/, ''),
+ 'c 9 -#ffffff00 P 4',
+ left, bottom,
+ left, top,
+ right, top,
+ right, bottom
+ ].join(' ');
this.bbScale = (maxWidth && maxHeight && (drawingWidth > maxWidth ||
drawingHeight > maxHeight || bbEnlarge))
? Math.min(maxWidth / drawingWidth, maxHeight / drawingHeight)
: 1;
@@ -299,8 +319,6 @@
}
ctx.fillStyle = 'rgba(0,0,0,0)';
ctx.fillRect(0, 0, pixelWidth, pixelHeight);
- ctx.fillStyle = this.bgcolor.canvasColor;
- ctx.fillRect(Math.round(ctxScale * this.marginX), Math.round(ctxScale
* this.marginY), Math.round(ctxScale * bbScaledDrawingWidth),
Math.round(ctxScale * bbScaledDrawingHeight));
ctx.scale(ctxScale, ctxScale);
ctx.translate(this.marginX, this.marginY);
if (this.invertY) {
=======================================
--- /canviz/trunk/src/Entity.js Fri Sep 20 06:45:49 2013 UTC
+++ /canviz/trunk/src/Entity.js Tue Sep 24 05:59:15 2013 UTC
@@ -63,7 +63,6 @@
return attrValue;
},
draw: function (ctx, ctxScale, redrawCanvasOnly) {
- var i, tokens, fillColor, strokeColor;
if (!redrawCanvasOnly) {
this.initBB();
if (IS_BROWSER) {
@@ -73,8 +72,11 @@
}
}
ctx.lineWidth = 1;
- var keys = objectKeys(this.drawAttrs),
- keysLength = keys.length;
+ var i, tokens;
+ var fillColor = this.parseColor('lightgrey'), strokeColor =
this.parseColor('black');
+ var fontFamily = 'Times', fontSize = 14;
+ var keys = objectKeys(this.drawAttrs);
+ var keysLength = keys.length;
for (var k = 0; k < keysLength; ++k) {
var command = this.drawAttrs[keys[k]],
tokenizer = Tokenizer(command),
@@ -322,8 +324,8 @@
}
break;
case 'F': // set font
- var fontSize = tokenizer.takeNumber();
- var fontFamily = tokenizer.takeString();
+ fontSize = tokenizer.takeNumber();
+ fontFamily = tokenizer.takeString();
if (fontFamily == 'Times-Roman') fontFamily = 'Times';
// debug('set font ' + fontSize + 'pt ' + fontFamily);
break;