get data sent from flask to html

Question

I am doing a flask application and I have a issue related to data sent from render_template() in flask to html web page. This is my flask code ( I want to pass a number)

 screenx = ((int(width[0][0]) - 0)) 
 return render_template('/barchart.html', screen = screenx) 

while this is my html code.

<canvas id="myCanvas" width="1024" height="768"></canvas>
<script >


                           screenx1={{screen}}
                           count = 0; 
                           var canvas = document.getElementById('myCanvas');
                           var context = canvas.getContext('2d');
                           
                            myint = {{ mydict }}
                            console.log(" queste sono le coordinates", myint)
                            //var coordinates = canvas.toDataURL("text/plain");
                            //console.log(" queste sono le coordinates", coordinates)
                            var ref = canvas.toDataURL("image/png");
                        
                            //console.log(ref)
                          
                            //var imageObj = document.getElementById("mappa2");
                            //ctx.drawImage(imageObj,300,100);
                            var markerObj = new Image();
                            ref.onload = function() {
                            context.drawImage(ref, 0, 0, 1024,768);
                          
                            };
                        
                            markerObj.onload = function() {
                            context.drawImage(markerObj, 0,0, 20,20);
                            markerObj.style['z-index'] = "1";
                        };
                        
                         
                            markerObj.src = "https://cdn-icons-png.flaticon.com/512/684/684908.png";
                            var canvas = document.getElementById("myCanvas");
                            var canvasWidth = canvas.width;
                            var canvasHeight = canvas.height;
                            var ctx = canvas.getContext("2d");
                            var canvasData = ctx.getImageData(0, 0, canvasWidth, canvasHeight);  
     </script>
                           
</body>    

I tried to get the data by using this

{{ screen}}

but nothing is sent. Please can you help me?

Answer 1

Flask

screenx = ((int(width[0][0]) - 0)) 
return render_template('/barchart.html', data=screenx)

HTML

screenx1={{data}}

Use data instead of screen?