Link to interactives in video figure captions; interactives for rest of creating part

Author: cpsievert

creating-bars.Rmd

@@ -18,7 +18,7 @@ subplot(
 )
 ```
 
-```{r bars-numeric, echo = FALSE, fig.cap = "(ref:bars-numeric)"}
+```{r bars-numeric, echo = FALSE, fig.cap = "(ref:bars-numeric)", out.extra = 'data-url="/interactives/bars-numeric.html"'}
 knitr::include_graphics("images/bars-numeric.svg")
 ```
 
@@ -36,7 +36,7 @@ p2 <- diamonds %>%
 subplot(p1, p2) %>% hide_legend()
 ```
 
-```{r bars-discrete, echo = FALSE, fig.cap = "(ref:bars-discrete)"}
+```{r bars-discrete, echo = FALSE, fig.cap = "(ref:bars-discrete)", out.extra = 'data-url="/interactives/bars-discrete.html"'}
 knitr::include_graphics("images/bars-discrete.svg")
 ```
 
@@ -60,7 +60,7 @@ diamonds %>%
   hide_legend()
 ```
 
-```{r many-prices, echo = FALSE, fig.cap = "(ref:many-prices)"}
+```{r many-prices, echo = FALSE, fig.cap = "(ref:many-prices)", out.extra = 'data-url="/interactives/many-prices.html"'}
 knitr::include_graphics("images/many-prices.svg")
 ```
 
@@ -74,7 +74,7 @@ plot_ly(diamonds, x = ~cut, color = ~clarity) %>%
   add_histogram()
 ```
 
-```{r cut-by-clarity, echo = FALSE, fig.cap = "(ref:cut-by-clarity)"}
+```{r cut-by-clarity, echo = FALSE, fig.cap = "(ref:cut-by-clarity)", out.extra = 'data-url="/interactives/cut-by-clarity.html"'}
 knitr::include_graphics("images/cut-by-clarity.svg")
 ```
 
@@ -92,7 +92,7 @@ cc2 %>%
   layout(barmode = "stack")
 ```
 
-```{r cut-by-clarity-prop, echo = FALSE, fig.cap = "(ref:cut-by-clarity-prop)"}
+```{r cut-by-clarity-prop, echo = FALSE, fig.cap = "(ref:cut-by-clarity-prop)", out.extra = 'data-url="/interactives/cut-by-clarity-prop.html"'}
 knitr::include_graphics("images/cut-by-clarity-prop.svg")
 ```
 
@@ -105,7 +105,7 @@ p <- ggplot(data = cc) +
 ggplotly(p)
 ```
 
-```{r ggmosaic, echo = FALSE, fig.cap = "(ref:ggmosaic)"}
+```{r ggmosaic, echo = FALSE, fig.cap = "(ref:ggmosaic)", out.extra = 'data-url="/interactives/ggmosaic.html"'}
 knitr::include_graphics("images/ggmosaic.svg")
 ```
 
@@ -124,7 +124,7 @@ subplot(
 ) %>% hide_legend()
 ```
 
-```{r cut-boxes, echo = FALSE, fig.cap = "(ref:cut-boxes)"}
+```{r cut-boxes, echo = FALSE, fig.cap = "(ref:cut-boxes)", out.extra = 'data-url="/interactives/bars-numeric.html"', out.extra = 'data-url="/interactives/cut-boxes.html"'}
 knitr::include_graphics("images/cut-boxes.svg")
 ```
 
@@ -136,7 +136,7 @@ plot_ly(diamonds, x = ~price, y = ~interaction(clarity, cut)) %>%
   layout(yaxis = list(title = ""))
 ```
 
-```{r cut-by-clarity-boxes, echo = FALSE, fig.cap = "(ref:cut-by-clarity-boxes)"}
+```{r cut-by-clarity-boxes, echo = FALSE, fig.cap = "(ref:cut-by-clarity-boxes)", out.extra = 'data-url="/interactives/cut-by-clarity-boxes.html"'}
 knitr::include_graphics("images/cut-by-clarity-boxes.svg")
 ```
 
@@ -159,7 +159,7 @@ plot_ly(d, x = ~price, y = ~factor(cc, lvls)) %>%
   layout(yaxis = list(title = ""))
 ```
 
-```{r cut-by-clarity-boxes-sorted, echo = FALSE, fig.cap = "(ref:cut-by-clarity-boxes-sorted)"}
+```{r cut-by-clarity-boxes-sorted, echo = FALSE, fig.cap = "(ref:cut-by-clarity-boxes-sorted)", out.extra = 'data-url="/interactives/cut-by-clarity-boxes-sorted.html"'}
 knitr::include_graphics("images/cut-by-clarity-boxes-sorted.svg")
 ```
 

creating-maps.Rmd

@@ -124,7 +124,7 @@ library(htmltools)
 browsable(tagList(map1, map2))
 ```
 
-```{r maps, echo = FALSE, fig.cap = "(ref:maps)"}
+```{r maps, echo = FALSE, fig.cap = "(ref:maps)", out.extra = 'data-url="/interactives/maps.html"'}
 knitr::include_graphics("images/maps.png")
 ```
 
@@ -149,7 +149,7 @@ plot_geo() %>%
   layout(geo = g)
 ```
 
-```{r us-density, echo = FALSE, fig.cap = "(ref:us-density)"}
+```{r us-density, echo = FALSE, fig.cap = "(ref:us-density)", out.extra = 'data-url="/interactives/us-density.html"'}
 knitr::include_graphics("images/us-density.svg")
 ```
 
@@ -175,7 +175,7 @@ class(world)
 plot_ly(world, color = I("gray90"), stroke = I("black"), span = I(1))
 ```
 
-```{r world, echo = FALSE, fig.cap = "(ref:world)"}
+```{r world, echo = FALSE, fig.cap = "(ref:world)", out.extra = 'data-url="/interactives/world.html"'}
 knitr::include_graphics("images/world.svg")
 ```
 
@@ -199,7 +199,7 @@ canada <- ne_states(country = "Canada", returnclass = "sf")
 plot_ly(canada, split = ~name, color = ~provnum_ne)
 ```
 
-```{r split-color, echo = FALSE, fig.cap = "(ref:split-color)"}
+```{r split-color, echo = FALSE, fig.cap = "(ref:split-color)", out.extra = 'data-url="/interactives/split-color.html"'}
 knitr::include_graphics("images/split-color.svg")
 ```
 
@@ -217,7 +217,7 @@ plot_ly(
 )
 ```
 
-```{r split-text, echo = FALSE, fig.cap = "(ref:split-text)"}
+```{r split-text, echo = FALSE, fig.cap = "(ref:split-text)", out.extra = 'data-url="/interactives/split-text.html"'}
 knitr::include_graphics("images/split-text.png")
 ```
 
@@ -249,7 +249,7 @@ p <- ggplot() +
 ggplotly(p)
 ```
 
-```{r canada-ggplotly, echo = FALSE, fig.cap = "(ref:canada-ggplotly)"}
+```{r canada-ggplotly, echo = FALSE, fig.cap = "(ref:canada-ggplotly)", out.extra = 'data-url="/interactives/canada-ggplotly.html"'}
 knitr::include_graphics("images/canada-ggplotly.svg")
 ```
 
@@ -297,7 +297,7 @@ plot_ly(us_cont) %>%
   colorbar(title = "Population \n 2014")
 ```
 
-```{r cartogram, echo = FALSE, fig.cap = "(ref:cartogram)"}
+```{r cartogram, echo = FALSE, fig.cap = "(ref:cartogram)", out.extra = 'data-url="/interactives/cartogram.html"'}
 knitr::include_graphics("images/cartogram.png")
 ```
 
@@ -324,13 +324,13 @@ plot_ly(stroke = I("black"), span = I(1)) %>%
   layout(showlegend = FALSE)
 ```
 
-```{r cartogram-dorling, echo = FALSE, fig.cap = "(ref:cartogram-dorling)"}
+```{r cartogram-dorling, echo = FALSE, fig.cap = "(ref:cartogram-dorling)", out.extra = 'data-url="/interactives/cartogram-dorling.html"'}
 knitr::include_graphics("images/cartogram-dorling.svg")
 ```
 
 Figure \@ref(fig:cartogram-ncont) demonstrates a non-continuous cartogram of US population in 2014 from @Olson. In contrast to the Dorling cartogram, this approach does preserve the shape of polygons. The implementation behind Figure \@ref(fig:cartogram-ncont) is to simply take the implementation of Figure \@ref(fig:cartogram-dorling) and change `cartogram_dorling()` to `cartogram_ncont()`.
 
-```{r cartogram-ncont, echo = FALSE, fig.cap = "(ref:cartogram-ncont)"}
+```{r cartogram-ncont, echo = FALSE, fig.cap = "(ref:cartogram-ncont)", out.extra = 'data-url="/interactives/cartogram-ncont.html"'}
 knitr::include_graphics("images/cartogram-ncont.svg")
 ```
 
@@ -343,6 +343,6 @@ tiles_sf <- st_as_sf(tiles)
 plot_ly(tiles_sf, split = ~name)
 ```
 
-```{r cartogram-tiles, echo = FALSE, fig.cap = "(ref:cartogram-tiles)"}
+```{r cartogram-tiles, echo = FALSE, fig.cap = "(ref:cartogram-tiles)", out.extra = 'data-url="/interactives/cartogram-tiles.html"'}
 knitr::include_graphics("images/cartogram-tiles.svg")
 ```

creating-other.Rmd

@@ -20,7 +20,7 @@ subplot(
 )
 ```
 
-```{r histogram2d, echo = FALSE, fig.cap = "(ref:histogram2d)"}
+```{r histogram2d, echo = FALSE, fig.cap = "(ref:histogram2d)", out.extra = 'data-url="/interactives/histogram2d.html"'}
 knitr::include_graphics("images/histogram2d.svg")
 ```
 
@@ -44,7 +44,7 @@ plot_ly(kd, x = ~x, y = ~y, z = ~count) %>%
   colorbar(title = "Number of diamonds")
 ```
 
-```{r heatmap-corr-diamonds, echo = FALSE, fig.cap = "(ref:heatmap-corr-diamonds)"}
+```{r heatmap-corr-diamonds, echo = FALSE, fig.cap = "(ref:heatmap-corr-diamonds)", out.extra = 'data-url="/interactives/heatmap-corr-diamonds.html"'}
 knitr::include_graphics("images/heatmap-corr-diamonds.svg")
 ```
 
@@ -61,7 +61,7 @@ plot_ly(x = rownames(corr), y = colnames(corr), z = corr, colors = "RdBu") %>%
   colorbar(limits = c(-1, 1))
 ```
 
-```{r correlation, echo = FALSE, fig.cap = "(ref:correlation)"}
+```{r correlation, echo = FALSE, fig.cap = "(ref:correlation)", out.extra = 'data-url="/interactives/correlation.html"'}
 knitr::include_graphics("images/correlation.svg")
 ```
 
@@ -76,7 +76,7 @@ plot_ly(mpg, x = ~cty, y = ~hwy, z = ~cyl) %>%
   add_markers(color = ~cyl)
 ```
 
-```{r 3D-scatterplot, echo = FALSE, fig.cap = "(ref:3D-scatterplot)"}
+```{r 3D-scatterplot, echo = FALSE, fig.cap = "(ref:3D-scatterplot)", out.extra = 'data-url="/interactives/3D-scatterplot.html"'}
 knitr::include_graphics("images/3D-scatterplot.svg")
 ```
 
@@ -89,7 +89,7 @@ plot_ly(mpg, x = ~cty, y = ~hwy, z = ~cyl) %>%
   add_paths(color = ~displ)
 ```
 
-```{r 3D-paths, echo = FALSE, fig.cap = "(ref:3D-paths)"}
+```{r 3D-paths, echo = FALSE, fig.cap = "(ref:3D-paths)", out.extra = 'data-url="/interactives/3D-paths.html"'}
 knitr::include_graphics("images/3D-paths.png")
 ```
 
@@ -102,7 +102,7 @@ plot_ly(mpg, x = ~cty, y = ~hwy, z = ~cyl) %>%
   add_lines(color = ~displ)
 ```
 
-```{r 3D-lines, echo = FALSE, fig.cap = "(ref:3D-lines)"}
+```{r 3D-lines, echo = FALSE, fig.cap = "(ref:3D-lines)", out.extra = 'data-url="/interactives/3D-lines.html"'}
 knitr::include_graphics("images/3D-lines.png")
 ```
 
@@ -114,7 +114,7 @@ plot_ly(mpg, x = ~cty, y = ~hwy, z = ~cyl) %>%
   add_lines(color = ~displ)
 ```
 
-```{r 3D-lines-groups, echo = FALSE, fig.cap = "(ref:3D-lines-groups)"}
+```{r 3D-lines-groups, echo = FALSE, fig.cap = "(ref:3D-lines-groups)", out.extra = 'data-url="/interactives/3D-lines-groups.html"'}
 knitr::include_graphics("images/3D-lines-groups.png")
 ```
 
@@ -134,7 +134,7 @@ plot_ly(mpg, x = ~cty, y = ~hwy, z = ~cyl) %>%
   )
 ```
 
-```{r 3D-axes, echo = FALSE, fig.cap = "(ref:3D-axes)"}
+```{r 3D-axes, echo = FALSE, fig.cap = "(ref:3D-axes)", out.extra = 'data-url="/interactives/3D-axes.html"'}
 knitr::include_graphics("images/3D-axes.png")
 ```
 
@@ -149,6 +149,6 @@ y <- seq_len(ncol(volcano)) + 500
 plot_ly() %>% add_surface(x = ~x, y = ~y, z = ~volcano)
 ```
 
-```{r surface, echo = FALSE, fig.cap = "(ref:surface)"}
+```{r surface, echo = FALSE, fig.cap = "(ref:surface)", out.extra = 'data-url="/interactives/surface.html"'}
 knitr::include_graphics("images/surface.png")
 ```

creating-overview.Rmd

@@ -28,7 +28,7 @@ plot_ly(diamonds, x = ~cut, y = ~clarity)
 plot_ly(diamonds, x = ~cut, color = ~clarity, colors = "Accent")
 ```
 
-```{r intro-defaults, echo = FALSE, fig.cap = "(ref:intro-defaults)", fig.link = "/interactives/intro-defaults.html"}
+```{r intro-defaults, echo = FALSE, fig.cap = "(ref:intro-defaults)", out.extra = '"data-url=/interactives/intro-defaults.html"'}
 knitr::include_graphics("images/intro-defaults.svg")
 ```
 
@@ -47,7 +47,7 @@ plot_ly(diamonds, x = ~cut, color = "black")
 plot_ly(diamonds, x = ~cut, color = I("red"), stroke = I("black"), span = I(2))
 ```
 
-```{r intro-range, echo = FALSE, fig.cap = "(ref:intro-range)", fig.link = "/interactives/intro-range.html"}
+```{r intro-range, echo = FALSE, fig.cap = "(ref:intro-range)", out.extra = '"data-url=/interactives/intro-range.html"'}
 knitr::include_graphics("images/intro-range.svg")
 ```
 
@@ -114,7 +114,7 @@ diamonds %>%
   )
 ```
 
-```{r intro-dplyr, echo = FALSE, fig.cap = "(ref:intro-dplyr)", fig.link = "/interactives/intro-dplyr.html"}
+```{r intro-dplyr, echo = FALSE, fig.cap = "(ref:intro-dplyr)", out.extra = '"data-url=/interactives/intro-dplyr.html"'}
 knitr::include_graphics("images/intro-dplyr.png")
 ```
 
@@ -146,7 +146,7 @@ p <- plot_ly(diamonds, x = ~cut, color = ~clarity, colors = "Accent")
 plotly_json(p)
 ```
 
-```{r intro-json, echo = FALSE, fig.cap = "(ref:intro-json)", out.width="70%", fig.link = "/interactives/intro-json.html"}
+```{r intro-json, echo = FALSE, fig.cap = "(ref:intro-json)", out.width="70%", out.extra = '"data-url=/interactives/intro-json.html"'}
 knitr::include_graphics("images/intro-json.png")
 ```
 
@@ -191,7 +191,7 @@ p <- ggplot(diamonds, aes(x = log(carat), y = log(price))) +
 ggplotly(p)
 ```
 
-```{r hexbin, echo = FALSE, fig.cap = "(ref:hexbin)", fig.link = "/interactives/hexbin.html"}
+```{r hexbin, echo = FALSE, fig.cap = "(ref:hexbin)", out.extra = '"data-url=/interactives/hexbin.html"'}
 knitr::include_graphics("images/hexbin.png")
 ```
 

docs/animating-views.html

@@ -438,7 +438,7 @@ <h2><span class="header-section-number">14.2</span> Animation support</h2>
 <div class="figure" style="text-align: center"><span id="fig:profile-pyramid"></span>
 <iframe src="https://player.vimeo.com/video/317101075?title=0&amp;byline=0&amp;portrait=0" width="100%" height="400" frameborder="0" seamless="seamless" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
 <p class="caption">
-FIGURE 14.5: US population projections by age and gender from 2018 to 2050. This population pyramid is implemented with thick line segments to give the appearance of bars.
+FIGURE 14.5: US population projections by age and gender from 2018 to 2050. This population pyramid is implemented with thick line segments to give the appearance of bars. For the interactive, see <a href="https://plotly-r.com/interactives/profile-pyramid.html" class="uri">https://plotly-r.com/interactives/profile-pyramid.html</a>
 </p>
 </div>
 <p>Although population pyramids are quite popular, they aren’t necessarily the best way to visualize this information, especially if the goal is to compare the population profiles over time. It’s much easier to compare them along a common scale, as done in Figure <a href="animating-views.html#fig:profile-lines">14.6</a>. Note that, when animating lines in this fashion, it can help to set <a href="https://plot.ly/r/reference/#scatter-line-simplify"><code>line.simplify</code></a> to <code>FALSE</code> so that the number of points along the path are left unaffected.</p>
@@ -453,7 +453,7 @@ <h2><span class="header-section-number">14.2</span> Animation support</h2>
 <div class="figure" style="text-align: center"><span id="fig:profile-lines"></span>
 <iframe src="https://player.vimeo.com/video/317101952?title=0&amp;byline=0&amp;portrait=0" width="100%" height="400" frameborder="0" seamless="seamless" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
 <p class="caption">
-FIGURE 14.6: Visualizing the same information in Figure <a href="animating-views.html#fig:profile-pyramid">14.5</a> using lines rather than segments.
+FIGURE 14.6: Visualizing the same information in Figure <a href="animating-views.html#fig:profile-pyramid">14.5</a> using lines rather than segments. For the interactive, see <a href="https://plotly-r.com/interactives/profile-lines.html" class="uri">https://plotly-r.com/interactives/profile-lines.html</a>
 </p>
 </div>
 

docs/arranging-views.html

@@ -470,7 +470,7 @@ <h4><span class="header-section-number">13.1.2.1</span> Scatterplot matrices</h4
 <div class="figure" style="text-align: center"><span id="fig:splom"></span>
 <iframe src="https://player.vimeo.com/video/325081084?title=0&amp;byline=0&amp;portrait=0" width="100%" height="400" frameborder="0" seamless="seamless" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
 <p class="caption">
-FIGURE 13.7: Linked brushing in a scatterplot matrix of the iris dataset.
+FIGURE 13.7: Linked brushing in a scatterplot matrix of the iris dataset. For the interactive, see <a href="https://plotly-r.com/interactives/splom.html" class="uri">https://plotly-r.com/interactives/splom.html</a>
 </p>
 </div>
 <p>See <a href="https://plot.ly/r/splom/" class="uri">https://plot.ly/r/splom/</a> for more options related to the splom trace type.</p>
@@ -639,7 +639,7 @@ <h2><span class="header-section-number">13.3</span> Arranging many views</h2>
 <div class="figure" style="text-align: center"><span id="fig:trelliscope"></span>
 <iframe src="https://player.vimeo.com/video/325778067?title=0&amp;byline=0&amp;portrait=0" width="100%" height="400" frameborder="0" seamless="seamless" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
 <p class="caption">
-FIGURE 13.14: Using <strong>trelliscopejs</strong> to surface high-dimensional insights related to life expectancy and GDP per capita in various countries.
+FIGURE 13.14: Using <strong>trelliscopejs</strong> to surface high-dimensional insights related to life expectancy and GDP per capita in various countries. For the interactive, see <a href="https://plotly-r.com/interactives/trelliscope.html" class="uri">https://plotly-r.com/interactives/trelliscope.html</a>
 </p>
 </div>