michael/pathfinder
michael
/
pathfinder
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix colors and view box for the reference in the SVG reftest

This commit is contained in:
Patrick Walton 2018-01-04 14:14:47 -08:00
parent c5187deedd
commit 275a937439
7 changed files with 44 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
demo/client/src/benchmark.ts
View File

@ -243,7 +243,7 @@ class BenchmarkAppController extends DemoAppController<BenchmarkTestView> {
this.view.then(view => {
view.recreateRenderer();
view.attachMeshes([meshes]);
view.initCameraBounds(this.svgLoader.svgBounds);
view.initCameraBounds(this.svgLoader.svgViewBox);
});
});
}
@ -401,9 +401,9 @@ class BenchmarkTestView extends DemoView {
}
}
initCameraBounds(bounds: glmatrix.vec4): void {
initCameraBounds(viewBox: glmatrix.vec4): void {
if (this.renderer instanceof BenchmarkSVGRenderer)
this.renderer.initCameraBounds(bounds);
this.renderer.initCameraBounds(viewBox);
}
protected renderingFinished(): void {
@ -470,7 +470,7 @@ class BenchmarkTextRenderer extends Renderer {
return glmatrix.vec2.clone([1.0, 1.0]);
}
protected get worldTransform() {
protected get worldTransform(): glmatrix.mat4 {
const canvas = this.renderContext.canvas;
const transform = glmatrix.mat4.create();
@ -612,7 +612,7 @@ class BenchmarkSVGRenderer extends SVGRenderer {
}
constructor(renderContext: BenchmarkTestView) {
super(renderContext);
super(renderContext, {sizeToFit: false});
}
}

11
demo/client/src/reference-test.ts
View File

@ -516,7 +516,7 @@ class ReferenceTestAppController extends DemoAppController<ReferenceTestView> {
this.view.then(view => {
view.recreateRenderer();
view.attachMeshes([meshes]);
view.initCameraBounds(this.svgLoader.svgBounds);
view.initCameraBounds(this.svgLoader.svgViewBox);
});
});
}
@ -537,7 +537,6 @@ class ReferenceTestAppController extends DemoAppController<ReferenceTestView> {
break;
case 'svg':
// TODO(pcwalton): Custom SVGs.
// TODO(pcwalton): Detect scale.
request = {
name: unwrapNull(this.builtinSvgName),
renderer: 'pixman',
@ -614,9 +613,9 @@ class ReferenceTestView extends DemoView {
}
}
initCameraBounds(bounds: glmatrix.vec4): void {
initCameraBounds(viewBox: glmatrix.vec4): void {
if (this.renderer instanceof ReferenceTestSVGRenderer)
this.renderer.initCameraBounds(bounds);
this.renderer.initCameraBounds(viewBox);
}
protected renderingFinished(): void {
@ -701,7 +700,7 @@ class ReferenceTestTextRenderer extends Renderer {
return glmatrix.vec2.clone([1.0, 1.0]);
}
protected get worldTransform() {
protected get worldTransform(): glmatrix.mat4 {
const canvas = this.renderContext.canvas;
const transform = glmatrix.mat4.create();
@ -836,7 +835,7 @@ class ReferenceTestSVGRenderer extends SVGRenderer {
}
constructor(renderContext: ReferenceTestView) {
super(renderContext);
super(renderContext, {sizeToFit: false});
}
}

8
demo/client/src/svg-demo.ts
View File

@ -62,7 +62,7 @@ class SVGDemoController extends DemoAppController<SVGDemoView> {
private meshesReceived(): void {
this.view.then(view => {
view.attachMeshes([this.meshes]);
view.initCameraBounds(this.loader.svgBounds);
view.initCameraBounds(this.loader.svgViewBox);
});
}
}
@ -82,13 +82,13 @@ class SVGDemoView extends DemoView {
super(gammaLUT, commonShaderSource, shaderSources);
this.appController = appController;
this.renderer = new SVGDemoRenderer(this);
this.renderer = new SVGDemoRenderer(this, {sizeToFit: true});
this.resizeToFit(true);
}
initCameraBounds(bounds: glmatrix.vec4): void {
this.renderer.initCameraBounds(bounds);
initCameraBounds(viewBox: glmatrix.vec4): void {
this.renderer.initCameraBounds(viewBox);
}
}

22
demo/client/src/svg-loader.ts
View File

@ -95,6 +95,7 @@ export class SVGLoader {
scale: number;
pathBounds: glmatrix.vec4[];
svgBounds: glmatrix.vec4;
svgViewBox: glmatrix.vec4;
isMonochrome: boolean;
private svg: SVGSVGElement;
@ -146,6 +147,10 @@ export class SVGLoader {
while ((kid = svgElement.firstChild) != null)
this.svg.appendChild(kid);
const viewBox = svgElement.viewBox.baseVal;
this.svg.setAttribute('width', "" + viewBox.width);
this.svg.setAttribute('height', "" + viewBox.height);
// Scan for geometry elements.
this.pathInstances.length = 0;
this.clipPathIDs = {};
@ -153,15 +158,12 @@ export class SVGLoader {
this.paths = [];
const svgBottomLeft = glmatrix.vec2.create(), svgTopRight = glmatrix.vec2.create();
for (const instance of this.pathInstances) {
const element = instance.element;
const svgCTM = element.getCTM();
const ctm = glmatrix.mat2d.fromValues(svgCTM.a, svgCTM.b,
svgCTM.c, svgCTM.d,
svgCTM.e, svgCTM.f);
glmatrix.mat2d.scale(ctm, ctm, [1.0, -1.0]);
const ctm = glmatrix.mat2d.fromValues(svgCTM.a, -svgCTM.b,
svgCTM.c, -svgCTM.d,
svgCTM.e, viewBox.height - svgCTM.f);
glmatrix.mat2d.scale(ctm, ctm, [this.scale, this.scale]);
const bottomLeft = glmatrix.vec2.create();
@ -188,9 +190,6 @@ export class SVGLoader {
topRight[0], topRight[1],
]);
glmatrix.vec2.min(svgBottomLeft, svgBottomLeft, bottomLeft);
glmatrix.vec2.max(svgTopRight, svgTopRight, topRight);
if (instance instanceof SVGFill) {
this.paths.push({
kind: { Fill: instance.pathfinderFillRule },
@ -207,9 +206,8 @@ export class SVGLoader {
return glmatrix.vec4.equals(pathInstance.color, this.pathInstances[0].color);
});
this.svgBounds = glmatrix.vec4.clone([
svgBottomLeft[0], svgBottomLeft[1],
svgTopRight[0], svgTopRight[1],
this.svgViewBox = glmatrix.vec4.clone([
viewBox.x, viewBox.y, viewBox.x + viewBox.width, viewBox.y + viewBox.height,
]);
}

19
demo/client/src/svg-renderer.ts
View File

@ -35,11 +35,17 @@ const ANTIALIASING_STRATEGIES: AntialiasingStrategyTable = {
xcaa: MCAAStrategy,
};
export interface SVGRendererOptions {
sizeToFit?: boolean;
}
export abstract class SVGRenderer extends Renderer {
renderContext: RenderContext;
camera: OrthographicCamera;
private options: SVGRendererOptions;
get isMulticolor(): boolean {
return !this.loader.isMonochrome;
}
@ -80,9 +86,11 @@ export abstract class SVGRenderer extends Renderer {
protected abstract get loader(): SVGLoader;
protected abstract get canvas(): HTMLCanvasElement;
constructor(renderContext: RenderContext) {
constructor(renderContext: RenderContext, options: SVGRendererOptions) {
super(renderContext);
this.options = options;
this.camera = new OrthographicCamera(this.canvas, { scaleBounds: true });
this.camera.onPan = () => this.renderContext.setDirty();
this.camera.onZoom = () => this.renderContext.setDirty();
@ -107,9 +115,12 @@ export abstract class SVGRenderer extends Renderer {
this.uploadPathTransforms(1);
}
initCameraBounds(bounds: glmatrix.vec4): void {
this.camera.bounds = bounds;
this.camera.zoomToFit();
initCameraBounds(svgViewBox: glmatrix.vec4): void {
// The SVG origin is in the upper left, but the camera origin is in the lower left.
this.camera.bounds = svgViewBox;
if (this.options.sizeToFit)
this.camera.zoomToFit();
}
meshIndexForObject(objectIndex: number): number {

4
demo/server/src/main.rs
View File

@ -640,7 +640,9 @@ fn render_reference_svg(request: Json<RenderSvgReferenceRequest>)
svg_handle.render_cairo(&cairo_context);
}
let image_data = (*surface.get_data().unwrap()).to_vec();
let mut image_data = (*surface.get_data().unwrap()).to_vec();
image_data.chunks_mut(4).for_each(|color| color.swap(0, 2));
let image_buffer = match ImageBuffer::from_raw(image_size.width as u32,
image_size.height as u32,
image_data) {

4
resources/svg/Ghostscript_Tiger.svg
View File

@ -1,6 +1,6 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="svg2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 900" version="1.1">
<g id="g4" fill="none" transform="matrix(1.7656463,0,0,1.7656463,324.90716,255.00942)">
<svg id="svg2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" version="1.1">
<g id="g4" fill="none" transform="matrix(0.392366,0,0,0.392366,75.0,57.5)">
<g id="g6" stroke-width="0.17200001" stroke="#000" fill="#FFF">
<path id="path8" d="m-122.3,84.285s0.1,1.894-0.73,1.875c-0.82-0.019-17.27-48.094-37.8-45.851,0,0,17.78-7.353,38.53,43.976z"/>
</g>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 67 KiB

After

Width:  |  Height:  |  Size: 67 KiB