emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed

From: Jarmo Hurri <jarmo.hurri@iki.fi>
To: emacs-orgmode@gnu.org
Subject: Request: change SVG embedding in exported HTML
Date: Sat, 23 Jul 2016 15:53:44 +0300	[thread overview]
Message-ID: <87oa5oqzvr.fsf@iki.fi> (raw)


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

next             reply	other threads:[~2016-07-23 12:54 UTC|newest]

Thread overview: 10+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2016-07-23 12:53 Jarmo Hurri [this message]
2016-07-23 20:50 ` Request: change SVG embedding in exported HTML 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

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

  List information: https://www.orgmode.org/

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=87oa5oqzvr.fsf@iki.fi \
    --to=jarmo.hurri@iki.fi \
    --cc=emacs-orgmode@gnu.org \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link

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).