Skip to main content
SimilarExport ZIP
100%

Make the figures click-able in your RMarkdown=>HTML reports.

✓ Published0🌍 Public
DDougManuel
Last edited Sep 28, 2016
Created on Dec 6, 2018

This example demonstrates how to make figures clickable in an RMarkdown-generated HTML report, allowing readers to open images in full resolution in a new browser tab. It shows the integration of JavaScript with RMarkdown's HTML output to enhance interactivity. The code uses jQuery to select all images wrapped in figure elements, then wraps each image in an anchor tag that references the image source as the link URL. The script sets the link's title attribute to the image's alt text and adds `target="_blank"` to open the link in a new tab. The implementation relies on jQuery's `wrap` function and attribute manipulation methods.

AI-generated description

Similar vizzes

Loading thumbnail…

Knitr Latex Template

This example demonstrates a LaTeX-based report template for integrating R graphics and analysis into a reproducible document. The code shows how to structure a PDF report using the `article` document class, with customized margins, headers, and float handling via the `float` package. It employs `knitr` to embed R code chunks, including a `ggplot` visualization, and uses `xtable` for potential table output. The template also configures hyperlinks, date formatting, and absolute positioning through `textpos`, providing a complete setup for generating polished, data-driven reports.

LLeeMendelowitz
61% match
Loading thumbnail…

Some R to knit a view on ScraperWiki

This example demonstrates how to knit an R view of ScraperWiki data into a static HTML report. The script uses the `knitr` library to render an Rhtml file, processing embedded R code and visualizations into a final web page. It relies on `render_html()` to generate the output and writes the result to an index.html file, making the data view portable and shareable. The code highlights a workflow for automating data-report generation from a ScraperWiki source.

IIanHopkinson
59% match
Loading thumbnail…

hello

This example demonstrates HTML hyperlink behavior through four anchor tags, each using a different `target` attribute value (`_blank`, `_self`, `_parent`, `_top`) to control where the linked W3C site opens. The page also includes a JavaScript alert that fires on load, plus external styling from `info.css` and a separate `java.js` file that writes dynamic content to the document using `document.write`. The rendering relies on plain HTML, CSS, and vanilla JavaScript without any visualization libraries or frameworks, showing a basic interactive web page rather than a data-driven chart.

Kkimgooq
58% match
Loading thumbnail…

Plots in Tables

This example demonstrates how to embed small, arrow-based line charts directly within the cells of a LaTeX table, creating an integrated display of data and its visual summary. The R code uses `ggplot2` to generate four separate horizontal arrow segments (each representing a different x-range on a common scale), saving each as a PNG file with `ggsave`. The `dplyr` and `kableExtra` libraries then build a table where the second column contains LaTeX `\includegraphics` commands, referencing those saved images. The `kbl` function formats the table with `escape = F` to allow the raw LaTeX code, and `column_spec` sets the plot column's width. Overall, it shows a workflow for combining statistical graphics and tabular text in a single rendered document.

JJustinCally
57% match
Loading thumbnail…

Simple mechanism to link citation references with citation notes.

This interactive example links citation references to their corresponding notes using standard HTML anchor tags and jQuery. Clicking a citation reference or note highlights the associated parent element by adding a `highlight` class, while hovering over a reference displays the citation text in a popover. The code uses jQuery selectors to identify elements with `name` attributes containing `cite_` and applies the Bootstrap popover API with a hover trigger to show the citation content. Citations are stored as plain text within the page’s `#content` element, with links using `href` fragments to match references and notes.

HHypercubed
56% match
Loading thumbnail…

D3 Link Example

This example demonstrates how to make an SVG element function as a hyperlink in D3, allowing visual marks to navigate to external pages. It renders a single blue rectangle inside an SVG canvas and wraps it with an anchor element using the `xlink:href` attribute to link to Google. The code appends the SVG and rectangle dynamically using D3's selection and chaining methods, with the D3 library loaded from a CDN. The example highlights standard link behavior, such as opening in the current tab or a new tab with the meta key, though it notes that iframe-based viewers may interfere with such interactions.

CCurran Kelleher
56% match
Loading thumbnail…

HTML Cars Report

This example presents an interactive HTML-based report that visualizes automobile data as a dynamic, animated display. The page uses SVG for rendering and employs the D3.js library for force simulations and data binding, with a YouTube video embedded for additional context. The visualization’s layout and movement are driven by `d3.forceSimulation`, while SVG elements are manipulated through standard D3 selections and transitions. The report is contained in a single HTML file, with the chart’s structure and styling defined inline, and the video starting at a specific timestamp to highlight relevant features.

Ggharakhani1986
55% match
Loading thumbnail…

HTML Cars Report

This example presents an interactive HTML report for exploring car-related data. It constructs a page with a heading, "HTML Cars Report," and provides a blank canvas area, likely intended for dynamic content. The visualization logic is minimal, with the interface built directly from standard HTML elements, including the `<!DOCTYPE html>` declaration, `<html>`, `<head>`, and `<title>` tags. The code does not utilize any external JavaScript libraries or APIs, nor does it load or display a specific dataset; instead, it sets up a foundational structure for a potential report. The current page shows no charts, graphs, or data-driven visuals, serving primarily as a static template.

RRandika87
55% match