How to share SVG files?

Is there a (free) service that will allow me to upload SVG files (with embedded javascript) and then link to them. Most (like this forum) won’t serve “anonymous” SVG or won’t serve SVG with javascript. (honest, I’m trustworthy)

Do you mean to just share a link to a page containing the SVG or do you want to embed the uploaded SVG here on the forum?

Not sure what you mean by “anonymous” or if it’s important.

Sorry, I wasn’t clear. I’ll try again. Most file sharing/forum/blog sites (including this one) won’t upload and serve SVG files. (I assume for security reasons).
In this forum I want to demo 2 or 3 animated dot/layers files in SVG format. If I just include the SVG text, the reader has to cut & paste to create the .svg file and then open it with a browser. Also SVG files get big quickly.
I’d prefer to just include links in this forum so the reader could just click and see the result.
(I hope this is clearer - and forget anonymous)
thanks

Provided that I have understood what you really want to do I think I have a much, much better solution than what you are asking for, but I will answer your question as its posed first.

I think you can use the services I mentioned. Here are example that I have made:

Now on to something much better that I have been working on. It’s not officially deployed yet because I haven’t finished writing the user documentation and have some final testing left, but you can start using the basic functionality anyway if you bear in mind that it’s still a beta.

In you post, you can write:

[dot verbose=true]
digraph {
  a -> b
}
[/dot]
[dot]
digraph {
  a -> b
  a -> c
}
[/dot]

which will give you:

[dot verbose=true]
digraph {
a → b
}
[/dot]
[dot]
digraph {
a → b
a → c
}
[/dot]

If you want to preserve whitespace in the displayed DOT source, you can write:

[dot verbose=true]
```
digraph {
  a -> b
}
```
[/dot]
[dot]
```
digraph {
  a -> b
  a -> c
}
```
[/dot]

which will give you:

[dot verbose=true]

digraph {
  a -> b
}

[/dot]
[dot]

digraph {
  a -> b
  a -> c
}

[/dot]

If you don’t want to show the DOT source code, you can remove the verbose option.

  • Cool - On a quick glance, bl.ocks.org and github/gist look like what I want. I’ll start reading & playing.

  • Cool - d3-graphviz looks quite cool.

  • Dang - For a moment, I hoped d3-graphviz already included the feature I’m going to propose, but after a quick look, I think not. (The best code is that which is written by someone else) Time will tell

thanks

Then I don’t think I understand what you want. If you describe it in more detail, maybe I can add it to d3-graphviz.

I’ve looked at your question again. Perhaps the little word layers is the key? I’ve done some research on layers/overlays. I guess you want to use the Graphviz layers attribute to define the different graphs to do animated transitions between. I wasn’t really aware of this possibility even though I’ve seen this attribute scroll past my eyes many time while reading about other attributes.

I think it should be doable to implement this in d3-graphviz, but I think I need to see what your embedded JavaScript code does before I can say for sure. The tricky thing is mostly not to implement a certain functionality, but how to define a sensible way for users to control it.

As a reference, here’s the example from the FAQ and what is rendered from it today:
[dot verbose=true]

digraph G {
	layers="local:pvt:test:new:ofc";

	node1  [layer="pvt"];
	node2  [layer="all"];
	node3  [layer="pvt:ofc"];		/* pvt, test, new, and ofc */
	node2 -> node3  [layer="pvt:all"];	/* same as pvt:ofc */
	node2 -> node4 [layer=3];		/* same as test */
}

[/dot]
Not what you would expect perhaps? If you look in the console log, you can see that d3-graphviz even throws errors for it.

Likewise if you try to open it in the Graphviz Visual Editor.

I received help (thanks magjac), so I will move over to show-and-tell and continue the conversation about layers.

1 Like

Very interesting. I’m looking forward to seeing it :grin:

You mentioned wanting to be anonymous. The problem with bl.ocks.org is that it’s a CloudFlare site, which means they mistreat Tor users (iow, anonymous users).

I’ve struggled with publicly posting SVG files as well. The problem is that SVG files can contain javascript (which IMO is a poor design decision on the part of SVG inventors). J/s can be malicious so most websites block SVG files. Otherwise you could put a LAN port scanner inside of an SVG file. (btw, eBay port scans the LAN of all their users when they run eBay’s javascript).

We need someone to invent SSVG (secure SVG) which doesn’t allow javascript, then there would be more sites willing to host vector graphics submitted by the public.