quarto-dev / quarto-dev/quarto-cli

Julia plots made using plotly() backend does not render in HTML

Open
#13,370 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug engines-julia plotly
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

I have:
  • searched the issue tracker for similar issues
  • installed the latest version of Quarto CLI
  • formatted my issue following the Bug Reports guide
Bug description

TL;DR: Quarto documents when rendered to HTML fail to render plots created in Julia (using Plots package) and the plotly() backend.

Longer form: I initially posted about this bug on StackOverflow but was told to create an issue with folks who maintain QuartoRunner which I duly did. However, (a) I think they didn't find anyone with time to work on the issue and (b) I am not sure it is a QuartoRunner issue because the problem is with the HTML output.

Now I am not a Julia developer. Nevertheless, I ran some experiments and to me it looks like it might be a matter of simply using an updated Plotly library.

Steps to reproduce

Here is a minimum working example. The .qmd file is as follows:

---
title: "Quarto for preprints"
engine: julia
author:
  - name: John Doe
format:
    html: 
      standalone: true
      grid: 
        margin-width: 350px
      code-tools:
        source: true
        toggle: false
        caption: none
---

## Background 

```{julia}
using Plots, PlotlyBase
plotly()

t=0:0.05:2π
plot(t, sin.(t), label="sin(t)", title="A simple plot", xlabel="Time (s)",
     ylabel="Amplitude")
```

The Project.toml file for the Julia environment is as follows:

[deps]
PlotlyBase = "a03496cd-edff-5a9b-9e67-9cda94a718b5"
Plots = "91a5bcdd-55d7-5caf-9e0b-520d859cae80"
Actual behavior

If you quarto render this, it displays no plot.

Expected behavior

It should display a sine wave. When I checked the version of plotly being used:

cat index.html | grep cdn.plot

I got:

<script src="https://cdn.plot.ly/plotly-2.6.3.min.js"></script>    <div id="f5bd55f2_531b_4a8f_bfe0_ca12b9999b63" style="width:672px;height:480px;"></div>

When I created similar output from a Quarto+Python combination I saw that the HTML file was using plotly version 3.1.0. So I replaced -2.6.3.min.js with -3.1.0.min.js:

sed -i '' 's/-2\.6\.3\.min\.js/-3.1.0.min.js/g' index.html

And served the page, for example with:

python3 -m http.server

Now the plot loads!

Your environment
  • IDE: Neovim
  • OS: MacOS 15.6.1 (24G90)
Quarto check output
Quarto 1.8.24
[✓] Checking environment information...
      Quarto cache location: /Users/itabrah2/Library/Caches/quarto
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.6.3: OK
      Dart Sass version 1.87.0: OK
      Deno version 2.3.1: OK
      Typst version 0.13.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.8.24
      Path: /Applications/quarto/bin

[✓] Checking tools....................OK
      TinyTeX: (not installed)
      Chromium: (not installed)

[✓] Checking LaTeX....................OK
      Using: Installation From Path
      Path: /Library/TeX/texbin
      Version: 2024

[✓] Checking Chrome Headless....................OK
      Using: Chrome found on system
      Path: /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
      Source: MacOS known location

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.12.11 (Conda)
      Path: /Users/itabrah2/miniconda3/envs/qrto/bin/python
      Jupyter: 5.8.1
      Kernels: python3, julia-1.11, julia-1.10

[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........OK
      Version: 4.5.0
      Path: /Library/Frameworks/R.framework/Resources
      LibPaths:
        - /Library/Frameworks/R.framework/Versions/4.5-arm64/Resources/library
      knitr: (None)
      rmarkdown: (None)

      The knitr package is not available in this R installation.
      Install with install.packages("knitr")
      The rmarkdown package is not available in this R installation.
      Install with install.packages("rmarkdown")

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by rendering the provided minimum .qmd example with its Project.toml environment using Quarto 1.8.24, then inspect the generated index.html and its Plotly script reference. Compare the Julia output with the working Python-generated HTML and verify that the rendered page displays the sine wave without manually replacing the CDN URL.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
data-visualization, tooling
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.