emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
* Request: change SVG embedding in exported HTML
@ 2016-07-23 12:53 Jarmo Hurri
  2016-07-23 20:50 ` Scott Randby
  2016-07-24  8:24 ` Nicolas Goaziou
  0 siblings, 2 replies; 10+ messages in thread
From: Jarmo Hurri @ 2016-07-23 12:53 UTC (permalink / raw)
  To: emacs-orgmode


Greetings.

Request: An SVG file embedded in exported HTML should be embedded using
the <img> tag instead of <object>.

Short reasoning: The displayed size of the SVG image can not be
controlled from outside the SVG file when embedded using <object>, but
size can be controlled when embedded using <img>.

Here is the longer explanation.

The HTML exporter currently embeds SVG as an object. Here is an example
of the HTML produced by the exporter:

<div class="figure">
<p><object type="image/svg+xml" data="kolmio-nelio.svg" >
Sorry, your browser does not support SVG.</object>
</p>
</div>

I have in the past couple of days found out that there is a serious
disadvantage to this: the displayed size of the resulting web page image
can not be controlled in any reasonable manner; see, for example

https://css-tricks.com/scale-svg/

However, the size _can_ be controlled if embedding is done with an
<img>. For example, the exported code above could be

<div class="figure">
<img class="org-svg" src="kolmio-nelio.svg">
</div>

I have included 'class="org-svg"' above so that embedded SVG images can
then be distinguished from other images in CSS files. For example, the
following CSS then sets the width of SVG images to be 80% of the width
of the viewport.

.org-svg
{
    width: 80vw;
}

Current embedding using <object> has a nice textual fallback property
for browsers not capable of SVG (I have no idea if this support is
necessary nowadays). If need be, such fallback could also be added to
embedding using <img>. See

http://www.w3schools.com/jsref/event_onerror.asp

Jarmo

^ permalink raw reply	[flat|nested] 10+ messages in thread

end of thread, other threads:[~2016-07-24 21:30 UTC | newest]

Thread overview: 10+ messages (download: mbox.gz follow: Atom feed
-- links below jump to the message on this page --
2016-07-23 12:53 Request: change SVG embedding in exported HTML Jarmo Hurri
2016-07-23 20:50 ` Scott Randby
2016-07-24 16:50   ` Christian Moe
2016-07-24 16:55     ` Christian Moe
2016-07-24 17:40     ` Scott Randby
2016-07-24 21:30       ` Christian Moe
2016-07-24 17:51     ` Jarmo Hurri
2016-07-24 18:53       ` Jarmo Hurri
2016-07-24  8:24 ` Nicolas Goaziou
2016-07-24 14:42   ` Jarmo Hurri

Code repositories for project(s) associated with this public inbox

	https://git.savannah.gnu.org/cgit/emacs/org-mode.git

This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).