sgo.to drafts

Zdog

I really like Zdog: it is beautiful, simple and powerful. I'm exploring using it for some diagrams.

Since there is a chance I'll be building many diagrams, I was looking for something more declarative to make it easier to maintain. Something along the lines of the following:

<script type="text/z-dog" is="z-script">
  <illustration color="#FDB" dragRotate="true" width="240" height="240">
   <polygon
      stroke="20"
      color="#E62"
      sides="5"
      radius="50"
      >
    </polygon>
  </illustration>
</script>

To lead to something like the following:

So, I created a custom element that reads an XML input and maps that to the elements of Zdog one by one:

If you put these together, you can build the diagrams declaratively. For example:

<script type="text/z-dog" is="z-script">
  <illustration dragRotate="true" width="240" height="240" color="#FDB">
    <group translate="0 0 20">
      <ellipse
        stroke="8" width="160" height="80" fill="true" color="white">
      </ellipse>
      <ellipse
        stroke="8" diameter="70" fill="true" color="#EA0">
      </ellipse>
      <ellipse
        stroke="8" diameter="40" fill="true" color="#636">
      </ellipse>
      <ellipse
        stroke="8" diameter="30" fill="true" color="white" translate="15 -15">
      </ellipse>
    </group>
  </illustration>
</script>

Results in:

Here is another example:

Lets see how far this will take me!

WDYT?



HTML Comment Box is loading comments...