pandoc icon indicating copy to clipboard operation
pandoc copied to clipboard

New Feature: internal links to tables and figures and headers

Open GeraldLoeffler opened this issue 12 years ago • 149 comments

It's currently possible to include internal links to sections. I'd like to propose a similar feature for links to figures/images and tables.

It may make sense to provide this feature only if the figure/image or table that is being linked to has a caption. In that case Pandoc can today automatically generate a number for the figure or table and include it in the caption, e.g. "Figure 15".

At the most basic, the text of the link would be provided by the user, as is currently the case for links to sections.

Of course it would be very convenient if the automatically generated number for the figure or table would also be used for the text of the link, e.g. "as can be seen in Figure 15, blah", where "Figure 15" would be the internal link whose text is auto-generated from the figure it points to.

GeraldLoeffler avatar Apr 04 '13 16:04 GeraldLoeffler

That would be lovely indeed. In academic writing it is quite often necessary, and while automatic numbering of figures and tables is nice, it really should be linked to what is in the text.

kovla avatar May 03 '13 13:05 kovla

One could use the figure caption as link target, similar to links to captions:

![la lune](lalune.jpg "Voyage to the moon")

...is shown in figure [la lune]...

And/or without automatic generation of link text:

...is shown in [the figure](#la-lune)...

See also issue #615 on automatic numbering of figures and tables in HTML output.

nichtich avatar May 21 '13 16:05 nichtich

I concur. However, @nichtich suggestion breaks the current syntax. Maybe a less intrusive approach would be a syntax like:

![Voyage to the moon](lalune.jpg){la lune}

It would be great to be able to reference figures. As @nichtich said: it is nearly a requirement in academic writing.

liob avatar Jul 23 '13 12:07 liob

A more consistent format would be

![Voyage to the moon](lalune.jpg){#lalune}

See the current attribute format for headers.

jgm avatar Jul 23 '13 14:07 jgm

indeed, that is a more consistent format.

About the implementation: I see 2 major ways to implement this feature:

  1. Emulate something like the latex figure environment and output the figure as image with plain text underneath. Very much like figures are handled now in docx format, except that you put "Figure 1:" at the beginning. This would be the most portable way and should be fairly easy to implement in all format writers. However, than pandoc has to keep track of the references itself for cross referencing.
  2. Implement it the "proper" way in the corresponding format writer. Sticking with the docx example: Adding a caption to the image and then cross reference it in the text.

Can anybody (@jgm ?) make an educated guess on how much work either of the solutions will be?

liob avatar Jul 27 '13 11:07 liob

I agree - this is essential for academic writing. I wish I knew Haskell!

The current way around this, in the mailing list discussion, is functional but clumsy.

Would this mean using \autoref in the latex? Then from markdown input:

...is shown in [the figure](#la-lune)...

you would get the latex output:

...is shown in \autoref{la-lune}...

aaren avatar Sep 10 '13 11:09 aaren

![Voyage to the moon](lalune.jpg){#lalune}

I just tried to write something like

Some text

![Bla blah](pic.png)   {#something}

Some other text

I was surprised that did not work. It showed the image without caption, and a raw "{#something}" afterwards.

I assumed curly braces were for assigning attributes to anything... :D

AvverbioPronome avatar Sep 19 '13 14:09 AvverbioPronome

A workaround with numbered example lists is added to https://github.com/jgm/pandoc/issues/904

For my purposes, this method works well with docx.

CFCF avatar Nov 16 '13 16:11 CFCF

I agree that being able to reference figures is essential to academic writing. The workarounds linked to above aren't really satisfactory, in my opinion

![Voyage to the moon](lalune.jpg){#lalune} would be perfect

oliver-dew avatar Mar 29 '14 10:03 oliver-dew

Similar syntaxes would be very interesting for equations, too. In fact, why not adopt a completely general syntax? It would be especially nice if it could carry over to LaTeX bits, once you have to bail out and use say \begin{align} and friends.

srhb avatar Apr 24 '14 20:04 srhb

I have sympathy for the numbered example list approach, mainly for two reasons: Firstly, what we want are not really links but references, and secondly, the use case for numbered example lists is already close to, e.g., numbered equations. The example from the docs is close to a typical use case for figure references:

(@good)  This is a good example.

As (@good) illustrates, ...

This mechanism can already be used for figure references, as CFCF pointed out:

![Figure (@primitive_hut): The primitive hut](Illustrations\primitive_hut.png)

As can be seen in Figure (@primitive_hut), huts may be primitive.

# Index of Figures

(@primitive_hut) *Primitive hut* from the frontispiece of Marc-Antoine Laugier’s 1755 second edition of *Esssay on Architecture*, illustration by Charles-Dominique-Joseph-Eisen.

However, there are a few drawbacks:

  • You currently need an index of figures, since example lists require the (@id) to be at the beginning of a line at least once.
  • You have to add the Figure (@id): bit to the caption manually.
  • This breaks LaTeX/PDF output, since LaTeX adds a “Figure” prefix itself.

Thus, a proper referencing scheme would need a bit additional thinking. Especially, PDF and HTML output should work alike, probably by pandoc adding the Figure: bit to HTML output, while leaving it to LaTeX in the PDF case. Additionally, this should also work for referencing numbered sections, like in see chapter (@mychapter).

frederik-elwert avatar Apr 25 '14 03:04 frederik-elwert

Your workaround works as suggested, but I had to remove the parentheses when referencing the label, otherwise they were rendered in the output. After this modification my example looks like this:

Figure @figure is about being in time

![Figure @figure: Cubes](cubes.png)

(@figure) Figure 1

To remove the automatic numbering in LaTex (Figure 1:, etc.) you can add to the template:

\usepackage[labelformat=empty]{caption}

After rendering to pdf this produces the following output:

figure

btel avatar Apr 25 '14 22:04 btel

Just came across this issue as well and ended up here. I'm also really in favor of support for the syntax suggested by @jgm above:

![Voyage to the moon](lalune.jpg){#lalune}

Especially since this is the standard way of dealing with this in PHP Markdown Extra:

http://michelf.ca/projects/php-markdown/extra/#spe-attr

bitsgalore avatar May 08 '14 15:05 bitsgalore

Has there been any developments on this? It also seems to me that @jgm suggestiong

![Voyage to the moon](lalune.jpg){#lalune}

is the most consistent internally and with other tools. What would need to happen for this to be implemented?

mangecoeur avatar Jul 10 '14 14:07 mangecoeur

I was wanting to add support for this addition to the syntax. When trying to replicate papers using markdown for the scholmd project, this is the feature that stands out as most needed by Pandoc . In short this can be addressed through the general use of {#lalune} for labelling elements, and of @lalune for referencing the number of the corresponding element. The syntax (@) may be used to number elements that are otherwise unnumbered.

A general syntax for labels {#lalune}, that are associated with the preceding element would allow for any element to be labelled (paragraphs, equations, tables, etc.). By associating the label with an element in the abstract syntax tree, the properties of the element would be available when the reference was made, and so they can be numbered appropriately. This syntax is already used in one context in Pandoc (section heading labels), and is used by PHP Markdown extra. For elements that don't have numbers, such as equations, the syntax (@) may be used (from the example_lists extension). So an equation would be numbered and labelled as $$ F = G{m_1 m_2 \over r^2$$ (@) {#gravity}. (An alternative could be to use the example_lists extension style and number and label it in one go as $$ F = G{m_1 m_2 \over r^2$$ (@gravity). There are clearly some details and edge cases to be thought through here.)

When the document is rendered, Pandoc would associate a number with each labelled element, based on its type, and its position in the document. This logic would need to be carried out in Pandoc, so that it was available to the range of back-end writers (including HTML). The philosophy would be similar to Pandoc-citeproc, which carries out its own formatting of citations, rather than delegating to writers that support this approach (such as bibtex for latex). An option would to have this behaviour depend on the backend (so that it in latex it inserts \label and \ref commands), but elsewhere it may insert calculated numbers, if referencing is not supported by the backend. This has the advantage that it will work easily in contexts where only a fragment of the document is rendered. If pandoc is calculating the numbering, a syntax would be needed for specifying the start numbers in a fragment that wasn't being compiled in stand alone mode.

Labelled elements may be linked to, with the @ symbol being used to indicate the reference. So a trip to [the moon](@lalune) would be an anchor link to the element labelled {#lalune}. In this case the text is rendered as a trip to the moon.

The syntax The moon is illustrated in Figure @lalune may be used to insert the number of the referenced element, as well as a link to that element, with the text rendered as The moon is illustrated in Figure 1. This follows the syntax used for referencing numbered lists with the example_lists extension.

A further syntax could be to use square brackets [@lalune] to insert the type and number of the element that is referenced, similar to the behaviour of latex's \autoref command. So, the moon is illustrated in [@lalune] would be rendered as the moon is illustrated in Figure 1 (including a link to the anchor). To implement this feature would require some localisation or customisation capability, so that the word used to describe the element could be specified. In its simplest, this customisation could be put in the YAML header, with for example figure_label: Fig. if the style required a shortened label. The syntax for the reference, [@lalune], is the same as is used by the pandoc-citeproc library, so it would be overloading that usage to implement a self-citation. Pandoc would have the information on the context that is needed to either format it as a citation, or as a reference, assuming that there was no collision between the labels and the citation keys.

edwardabraham avatar Jul 23 '14 01:07 edwardabraham

@edwardabraham It must be pointed out that the syntax [@lalune] is already used in pandoc for bibliographical citations.

kovla avatar Jul 23 '14 06:07 kovla

@kovla @edwardabraham I don't see why #lalune couldn't be used also as a reference to the defined symbol. With this scheme [the moon](#lalune) could be a normal text link to the figure, while [#lalune] could do the numbered reference thing as mentioned. In fact, I have a custom build of Pandoc that does exactly this.

timtylin avatar Jul 23 '14 07:07 timtylin

@kovla The idea was to deliberately overload the [@lalune] syntax that is used for citations. The reason being that references to another part of the document are similar to citations (in essence they are self-citations). This has the benefit of avoiding introducing additional syntax. During processing the filter would identify which element the label was attached to, and use that information to appropriately format the text that is inserted into the document.

@eVITAERC I prefer using the @ symbol, as it extends functionality that is already used by example_lists. Are you able to structure your pandoc build so that it may be implemented as a filter?

Note that this extension is [@lalune] a convenience and is not necessary, provided that the numbers are able to be accessed through the @lalune method.

edwardabraham avatar Jul 24 '14 05:07 edwardabraham

@edwardabraham I tried the @ approach as well, but internal feedback in our lab showed that people get confused by what is a citation and what is an internal reference even when editing. The conclusion was that the mental model of keeping # for internal refs and using @ for external refs is the simplest to grok.

In fact, no one out of ten or so people have used example_lists (we are mostly writing extended abstracts and journal papers in the field of physics/engineering/applied math). When encountering a "list of scenarios" situation, the content was so static that people simply used literal numbers without issue.

Unfortunately the internal reference mechanism required heavy modification of the Markdown reader (additional state must be kept during the parsing process) and a custom AST, so I can't conceive of a filter implementation in the near future.

timtylin avatar Jul 24 '14 05:07 timtylin

Personally, the # symbol and the {#label} syntax would be easier to understand and use. In my mind citations and internal references follow very distinct "mental models". Many academic papers use distinct numbering for figures, tables, and equations but the proposed syntaxes don't appear to have a way to support distinct numberings by type. It would be an important design criteria (I only got to skim the comments, hopefully its not a redundant suggestion). @edwardabraham You mentioned the scholmd. Is it currently just a repository of ideas or have they implemented any of the academic markdown features? @eVITAERC Great work! Is it possible for you to propose submitting the changes to the pandoc project or alternately creating a github fork to allow others to experiment?

elcritch avatar Jul 24 '14 16:07 elcritch

+1 for use of # symbol for internal references. But it's really important that the references can distinguish between equations, figures, and tables to have distinct numbering sequences.

There are two approaches to my mind

  1. make the "thing referenced" explicit in the tag, for instance using namespaces like #eqn.maxwells, #fig.hockeystick. Pandoc would have to track the objects in each namespace and format the references appropriately
  2. depend on pandoc's parser to know what type of thing is referenced and handle appropriately. So if you tag an image and then use a # reference pandoc automatically treats it as a "fig" reference, if you embed latex formula it because an equation reference etc. This would be cool but i suspect it would be a) complex and b) fragile - you get issues for instance if someone wants to embed an image for a formula.

mangecoeur avatar Jul 24 '14 16:07 mangecoeur

I agree very much that internal references, citations and references to numbered examples are different, and @ is already too overloaded by being used for both the latter. The problem with #reference which I can see is that it might get confused with a level one header since atx headers don't requre a space after the hashmarks as far as I know. I think {#anchor} and [#reference] would be good because then the id could be any valid HTML id including LaTeX-y things like {#img:la-lune}. As for doing different things with different anchors that is probably best left to filters.

Note that you could already do something like <span id="img:la-lune">![Voyage to the Moon](lalune.jpg)</span> and then [Voyage to the Moon](#img:la-lune) and get anchors/labels and links which work in both HTML and LaTeX. If you don't want hyperlinks in your LaTeX, numbered images in your HTML etc. that can be done with filters, e.g. replacing links with URLs like the one in my example with a span containing the link text plus a raw LaTeX string \ref{img:la-lune}. (See http://johnmacfarlane.net/pandoc/try/?text=%3Cspan+id%3D%22img%3Afoo-bar%22%3E!%5BA+bar+frequented+by+foos%5D(foo-bar)%3C%2Fspan%3E%0A%0A%5BThe+foo+bar%5D(%23img%3Afoo-bar).&from=markdown&to=latex)

It would be nice to have a less ugly syntax, but note that you would need to turn references into links when generating HTML, while it is rather trivial to have a filter do the opposite when generating LaTeX. Note also that you could abuse the link title, having the filter leave links with a title alone so that you get a hyperlink. It would even be easy to use spans with certain classes and/or attributes in the source and have one filter which turns them into references when generating LaTeX and one which turns them into links when generating HTML. I'm going on holiday tomorrow but I would be happy to write those filters when I get back! :-)

bpj avatar Jul 24 '14 19:07 bpj

My goal is to produce HTML and PDF outputs from the same Markdown file, with the PDF containing references that can be printed (e.g. "See figure 1") . I found a cumbersome workaround inspired by @bpj's idea. Note that it does not work with pandoc 1.12.2.1 found in the Ubuntu APT repository, so I installed 1.12.4.2 from Cabal instead.

The following Markdown code:

<span id="pic.jpg"></span>

![A bar frequented by foos](pic.jpg)

[The foo bar](#pic.jpg).

Produces the following HTML code:

<p><span id="pic.jpg"></span></p>
<div class="figure">
<img src="pic.jpg" alt="A bar frequented by foos" /><p class="caption">A bar frequented by foos</p>
</div>
<p><a href="#pic.jpg">The foo bar</a>.</p>

This works reasonably well: the empty paragraph is not displayed so the link will navigate you to the image.

The generated LaTeX code is the following:

\label{pic.jpg}{}

\begin{figure}[htbp]
\centering
\includegraphics{pic.jpg}
\caption{A bar frequented by foos}
\end{figure}

\hyperref[pic.jpg]{The foo bar}.

The generated \label is of no use. Instead, we should add the label after the caption has been inserted. To do this, we save the filename of the current figure to a variable (\currentfigure) by redefining the \includegraphics command. We then redefine the \caption command to insert the caption and add the label from the variable. We also have to redefine the \hyperref command to \autoref. To achieve this, we edit the LaTeX template file's preamble:

\let\oldincludegraphics\includegraphics
\renewcommand*{\includegraphics}[1]{\oldincludegraphics{#1}\def\currentfigure{#1}}
\let\oldcaption\caption
\renewcommand*{\caption}[1]{\oldcaption{#1}\label{\currentfigure}}
\renewcommand*{\hyperref}[2][\ar]{%
  \def\ar{#2}
  #2 (\autoref{#1})}

In the final PDF document, the caption and the reference look like this. "Figure 1" is also a hyperlink.

Figure 1: A bar frequented by foos

The foo bar (Figure 1).

While I think this workaround can be used in practice, it would be nice to have a syntax for inserting cross references in a simpler and less error-prone way.

szarnyasg avatar Aug 10 '14 20:08 szarnyasg

Note that the following works identically without the need to (re)define any LaTeX commands and without generating an 'empty' paragraph (including the fact that at least in my PDF reader the link jumps to the caption rather than to the top of the image):

<div id="fig:lalune">
![A voyage to the moon\label{fig:lalune}](lalune.jpg)

</div>

[The voyage to the moon](#fig:lalune).

It is slightly less elegant in that you have to specify the id/label twice, and slightly more elegant in that you avoid the empty span element and the resulting empty paragraph.

Note that the blank line inside the div is necessary in order to make pandoc see the div contents as a paragraph, and thus to get the image inside a figure environment. With the blank line the resulting LaTeX is like this:

\begin{figure}[htbp]
\centering
\includegraphics{lalune.jpg}
\caption{A voyage to the moon\label{fig:lalune}}
\end{figure}

but without it it is just like this:

\includegraphics{lalune.jpg}

Den 2014-08-10 22:38, Gábor Szárnyas skrev:

My goal is to produce HTML and PDF outputs from the same Markdown file, with the PDF containing references that can be printed (e.g. "See figure 1") . I found a cumbersome workaround inspired by @bpj's idea. Note that it does not work with pandoc 1.12.2.1 found in the Ubuntu APT repository, so I installed 1.12.4.2 from Cabal instead.

The following Markdown code:

<span id="pic.jpg"></span>

![A bar frequented by foos](pic.jpg)

[The foo bar](#pic.jpg).

Produces the following HTML code:

<p><span id="pic.jpg"></span></p>
<div class="figure">
<img src="pic.jpg" alt="A bar frequented by foos" /><p class="caption">A bar frequented by foos</p>
</div>

This works reasonably well: the empty paragraph is not displayed so the link will navigate you to the image.

The generated LaTeX code is the following:

\label{pic.jpg}{}

\begin{figure}[htbp]
\centering
\includegraphics{pic.jpg}
\caption{A bar frequented by foos}
\end{figure}

\hyperref[pic.jpg]{The foo bar}.

The generated \label is of no use. Instead, we should add the label after the caption has been inserted. To do this, we save the filename of the current figure to a variable (\currentfigure) by redefining the \includegraphics command. We then redefine the \caption command to insert the caption and add the label from the variable. We also have to redefine the \hyperref command to \autoref. To achieve this, we edit the LaTeX template file's preamble:

\let\oldincludegraphics\includegraphics
\renewcommand*{\includegraphics}[1]{\oldincludegraphics{#1}\def\currentfigure{#1}}
\let\oldcaption\caption
\renewcommand*{\caption}[1]{\oldcaption{#1}\label{\currentfigure}}
\renewcommand*{\hyperref}[2][\ar]{%
   \def\ar{#2}
   #2 (\autoref{#1})}

In the final PDF document, the caption and the reference look like this. "Figure 1" is also a hyperlink.

Figure 1: A bar frequented by foos

The foo bar (Figure 1).

While I think this workaround can be used in practice, it would be nice to have a syntax for inserting cross references in a simpler and less error-prone way.


Reply to this email directly or view it on GitHub: https://github.com/jgm/pandoc/issues/813#issuecomment-51726484

bpj avatar Aug 11 '14 00:08 bpj

@bpj, thanks for the quick reply.

(including the fact that at least in my PDF reader the link jumps to the caption rather than to the top of the image)

I looked at this issue and found that it can be fixed easily by adding \usepackage{caption} to the template (see http://tex.stackexchange.com/questions/27096/href-to-an-image-label-how-to-jump-to-the-image-instead-of-the-caption-below-t for details).

It is slightly less elegant in that you have to specify the id/label twice, and slightly more elegant in that you avoid the empty span element and the resulting empty paragraph.

I agree, I also prefer your solution.

Note that the blank line inside the div is necessary in order to make pandoc see the div contents as a paragraph, and thus to get the image inside a figure environment.

Wow. I experimented with using a div element but couldn't get is working. Adding the extra newline did the trick.

szarnyasg avatar Aug 11 '14 08:08 szarnyasg

Den 2014-08-11 10:03, Gábor Szárnyas skrev:

@bpj, thanks for the quick reply.

@szarnyasg, you are welcome; sleeplessness has its advantages! ;)

(including the fact that at least in my PDF reader the link jumps to the caption rather than to the top of the image)

I looked at this issue and found that it can be fixed easily by adding \usepackage{caption} to the template (see http://tex.stackexchange.com/questions/27096/href-to-an-image-label-how-to-jump-to-the-image-instead-of-the-caption-below-t for details).

It does indeed! If a similar trick were possible in HTML one could just wrap the caption text in a span:

![<span id="fig:lalune">A voyage to the Moon</span>](lalune.jpg)

In practice you don't even see that you end up at a figure caption, though.

It is slightly less elegant in that you have to specify the id/label twice, and slightly more elegant in that you avoid the empty span element and the resulting empty paragraph.

I agree, I also prefer your solution.

Not needing to hack LaTeX is always preferable! :)

Note that the blank line inside the div is necessary in order to make pandoc see the div contents as a paragraph, and thus to get the image inside a figure environment.

Wow. I experimented with using a div element but couldn't get is working. Adding the extra newline did the trick.

See here and here for the explanation!

BTW for those who use Vim with the UltiSnips plugin I made a snippet for using this idiom which endeavors to (optionally) reduce typing duplication to a minimum:

# # ANCHORED FIGURE IN SOURCE FOR BOTH HTML AND LATEX
# 
#     <div id="fig:ID/LABEL/NAME">
#     ![CAPTION\label{fig:ID/LABEL/NAME}](ID/LABEL/NAME.jpg})
# 
#     </div>
# 
# ## Tabs
#
# Tab     Description                  Default
# ------  ---------------------------  -------
# $1      the entire id/label[^a]
# $2      id/label prefix              fig[^b]
# $3      id/label unique part
# $4      caption text
# $5      filename minus extension     $3
# $6      extension                    jpg[^c]
#
# [^a]: You should normally just skip this tab or the 'magic' with $5 will be lost!
# [^b]: The following `:` is automatically removed if you delete the prefix.
# [^c]: The separating dot is automatically removed if you delete the extension
#       -- for use with the --default-image-extension option!
#
# NOTE: The blank line inside inside the div is necessary to make pandoc
#   see a paragraph and thus place the image inside a figure environment!
#
snippet figdiv "Anchored figure in HTML and LaTeX" b
<div id="${1:${2:fig}${2/.+/:/}${3:ID/LABEL/NAME}}">
![${4:CAPTION}\\label\{$1}](${5:$3}${6/.+/./}${6:jpg})

</div>

$0
endsnippet

Reply to this email directly or view it on GitHub: https://github.com/jgm/pandoc/issues/813#issuecomment-51751650

bpj avatar Aug 11 '14 12:08 bpj

quick clarification regarding the div method. Redefining \hyperref is still needed in order to include a (Figure #)

ivotron avatar Aug 25 '14 22:08 ivotron

@bpj

I'm sorry but I had a bit of trouble following the last bit of your conversation with @szarnyasg. Does it mean that you found a way to to produce correct (LaTeX) references to figures, images and tables?

srhb avatar Sep 02 '14 14:09 srhb

@srhb: I managed to get it working, although it's a bit cumbersome. I created a Hungarian thesis template which is available here:

  • https://github.com/FTSRG/thesis-template-markdown
    • chapter2.md includes the figure
    • chapter4.md references it
    • the default.latex template redefines the hyperref command, see https://github.com/FTSRG/thesis-template-markdown/blob/master/default.latex#L142
  • http://docs.inf.mit.bme.hu/thesis-template-markdown/thesis.pdf (on page 8 "(2.1. ábra)" is the reference for the figure.

It requires Pandoc 1.12.4.2+.

HTH, Gabor

szarnyasg avatar Sep 02 '14 15:09 szarnyasg