Skip to content

When including multiple charts, all use the same data. #3207

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
2 tasks done
jaren-elizachat opened this issue Apr 7, 2025 · 0 comments
Open
2 tasks done

When including multiple charts, all use the same data. #3207

jaren-elizachat opened this issue Apr 7, 2025 · 0 comments

Comments

@jaren-elizachat
Copy link

Preliminary Checks

Description

Using tailwind, add multiple charts with different data using the chart shortcode to the same page.

All charts will have the same data because the fetchChartJSON function is overwritten. That function should be included in the anonymous function.

I've fixed this locally by overriding the chart shortcode partial with this:

{{ $json := printf "./%s.json" (.Get "data") }}
{{ $id := delimit (shuffle (seq 1 9)) "" }}
<div id="chart-{{$id}}" class="chart"></div>
<script>
  (function() {
    async function fetchChartJSON() {
        console.debug('Hugo Blox fetching chart JSON...')
        const response = await fetch('{{$json}}');
        return await response.json();
    }

    let a = setInterval( function() {
      if ( typeof window.Plotly === 'undefined' ) {
        console.debug('Plotly not loaded yet...')
        return;
      }
      clearInterval( a );

      fetchChartJSON().then(chart => {
        console.debug('Plotting chart...')
        window.Plotly.newPlot('chart-{{$id}}', chart.data, chart.layout, {responsive: true});
      });
    }, 500 );
  })();
</script>

Reproduction Link

too lazy

Steps to Reproduce

1.see description
2.
3.
...

Expected Result

all charts use their respective data

Actual Result

all charts use the same data

What Hugo Module versions does your site use?

github.com/HugoBlox/hugo-blox-builder/modules/blox-tailwind v0.3.1

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

No response

Which Hugo Blox template are you using?

its a partial, use any

What version of Hugo are you using?

0.136.5

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant