Cannot download the image

[lh12565]

I used the example for visualization, but I couldn't download the image. Is there something wrong with my code?

<template>
<v-btn @click="test()">Click to plot</v-btn>
    <div>
    <canvas  id="canvasId2" width="540" height="540"></canvas>
</div>
</template>
<script>
import addjscss from '@/utils/addjscss.ts'
const { loadjscssfile, removejscssfile } = addjscss()

export default {
    methods: {
     test(){
            var data = { "y": {
                     "vars": [ "Gene1"],
                     "smps": [ "Smp1", "Smp2", "Smp3" ],
                     "data": [ [ 10, 35, 88 ] ]
                   }
                 };

        // Configuration
        var conf = { "graphType": "Bar" };

        // Initialize object
        var cX = new CanvasXpress("canvasId2", data, conf);
            }
    },
   mounted() {
        loadjscssfile("/canvasXpress.css", "css")
        // this.loadjscssfile("/js/canvasXpress.min.js", "js");
        loadjscssfile("/canvasXpress.min.js", "js");
    },
}
</script>

[neuhausi]

Did you check in you Downloads directory? Also make sure you allow your browser to save automatically to your Downloads directory. What browser are you using?

[lh12565]

I'm using Google Chrome and there is no files in the download directory. While I can successfully download files using plain HTML, the issue appears to be related to Vue's reactive variables. However, I haven't yet identified the exact solution.

[neuhausi]

This is not Vue. It is just react. https://codesandbox.io/p/sandbox/sharp-hypatia-zxmc7s
Can you print from there?

[lh12565]

I'm not familiar with React. Let me double-check my code.