JessyInk

How can I automate slides in SVG embedded into an html page?

Asked by Mikhail Titov

I wonder if there is a tutorial out there on how can I advance slides from an html page if possible. I don't want a self-containing presentation, however single figure looks overloaded. Of course I can split SVG file into a few and embed those into an html page individually gradually adding more details. However I thought it would be neat if I can keep a single SVG that can be viewed alone or automated somehow from a page.

Question information

Language:
English Edit question
Status:
Solved
For:
JessyInk Edit question
Assignee:
No assignee Edit question
Solved by:
Mikhail Titov
Solved:
Last query:
Last reply:
Revision history for this message
Mikhail Titov (mtitov) said : 		#1

I accidentally used img tag as I was in Emacs Org Mode, as later I realized I'd be better off with embed tag for SVG.
Source code of this [1] web page summarized pretty much everything. One has to get a window of embedded SVG document and call JessyInk functions that can be seen in SVG file.

Something along the following lines do the job.

<embed id="jessy" src="drawing.svg" type="image/svg+xml" width="600px" style="border: 1px solid black" />
<a href="javascript:f()">Click me</a>
<script>
  function f() {
  var svg = document.getElementById('jessy');
  var doc, win;
  try {
    doc = svg.getSVGDocument();
  }
  catch(exception) {
    alert('The GetSVGDocument interface is not supported');
  }
  if (doc && doc.defaultView)
    win = doc.defaultView;
  else if (jessy.window)
    win = jessy.window;
  else try {
    win = jessy.getWindow();
  }
  catch(exception) {
    alert('The DocumentView interface is not supported\r\n' +
          'Non-W3C methods of obtaining "window" also failed');
  }
  win.skipEffects(1);
  }
</script>

[1] https://jwatt.org/svg/demos/scripting-across-embed.html

Revision history for this message
Hannes Hochreiner (hannes-hochreiner) said : 		#2

Nicely done! Thanks for sharing.