1 / 22

A Constraint Extension to Scalable Vector Graphics

A Constraint Extension to Scalable Vector Graphics. Greg J. Badros Jojada J. Tirtowidjojo Kim Marriott Bernd Meyer Will Portnoy Alan Borning May 1-5,2001,Hong Kong. ACM. Introduction. SVG is not enough SVG background CSVG (constraint scalable vector graphic) Implementation

monte
Download Presentation

A Constraint Extension to Scalable Vector Graphics

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. A Constraint Extension to Scalable Vector Graphics Greg J. Badros Jojada J. Tirtowidjojo Kim Marriott Bernd Meyer Will Portnoy Alan Borning May 1-5,2001,Hong Kong. ACM

  2. Introduction • SVG is not enough • SVG background • CSVG(constraint scalable vector graphic) • Implementation • Performance • Conclusion • Future work

  3. SVG is not enough • It does not provide for flexible layout given different viewer and browser capabilities,such as screen format and font preferences. • EX. Format.Xrignt + horiz_spacing <= DataFormat.Xleft • Example

  4. SVG is not enough(Cont.) • Interactive manipulation • Semantic zooming (Example) • Differential scaling • Semantic preserving manipulation(Example) • Animation • We can also make these properties dependent on a timer variable.

  5. SVG is not enough(Cont.) • Extending SVG—main technical contribution: • A motivation for using constraints and alternative layouts for a wide class of SVG diagrams • A description of Constraint Scalable Vector Graphics as an extension of SVG • A prototype implementation of a CSVG viewer based on the CSIRO SVG viewer

  6. SVG BACKGROUND • Basic: • < rect x=“20” y=“10” width=“10” height=“5”/> • < path d=“M 20 10 L 30 10 L 30 15 L 20 15 Z”/> • Animate: • < rect x=“20” y=“10” width=“10” height=“5”/> < animate atrributeName=“x” atrributeType=“XML” begin=“0s” dur=“0s” fill=“freeze” from=“20” to=“120” /> • Example

  7. CSVG(constraint scalable vector graphic) • Four extensions to the SVG language: • We store all SVG standard element attributes in predefined constraint variables and support identifier in addition to literal. • < rect id=“rectA” x=“20” y=“10” width=“square_edge” height=“square_edge” rx=“5” ry=“5”/> • Six predefined variable based on it’s id : rectA_x; rectA_y; rectA_width; rectA_height; rectA_rx; rectA_ry • Constraint variables may also be declared explicitly by using a new var element.

  8. CSVG (Cont.) • Add another new element type called constraint • Require attribute rule • Optional attribute strength • < constraint rule=“square_edge >=50” strength=“strong” /> < rect id=“rectA” x=“20” y=“10” width=“square_edge” height=“square_edge” />

  9. CSVG (Cont.) • Add several built-in read-only constraint variables. • Viewport_width • Viewport_height

  10. CSVG (Cont.) • Added alternate layouts for groups of SVG elements. • docase • gcase • Example • Layout example(109 constraints) • Interactive example(185 constraints) • Animation example(30 constraints)

  11. Implementation • CSVG DTD • Children of SVG group elements(svg ,g),add elements: • Var • Constraint • Docase • Constraint Solving engine • Architecture of implementation

  12. PERFORMANCE • Class hierarchy example • 266ms • Abacus example • 485ms • Moving a bead — 16ms • Machine: • Pentium II 450MHz • Java 1.2 with the Hotspot virtual machine

  13. CONCLUSION • Constraint-based graphics documents are difficult to author • No authoring environments for generating CSVG

  14. FUTURE WORK • Could support referencing other elements’ attributes directly. • To better describe the semantics of SVG in terms of constraints and constraint hierarchy theory.

More Related