Update app.py

app.py

@@ -361,18 +361,18 @@ with gr.Blocks(css=css) as demo:
                 pl.setAttribute('points', pts.slice(0,-1)); 
                 function chart(x,y) {
                   var pl_a = pl.getAttribute('points').split(' ');
-                  pl_a[x] = x+','+(y-64);
+                  pl_a[x] = x+','+y;
                   pl.setAttribute('points', pl_a.join(' '));
                 }
               </script>
-              <svg id='svg_in' viewBox='0 -64 256 64' onpointermove='chart(event.clientX-this.getBoundingClientRect().x, event.clientY-this.getBoundingClientRect().y);' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
+              <svg id='svg_in' viewBox='0 0 256 128' onpointermove='try{chart(event.clientX-this.getBoundingClientRect().x, event.clientY-this.getBoundingClientRect().y);}catch(e){alert(e);}' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
                 <defs>
                   <linearGradient id="lg" x1="0%" x2="100%" y1="50%" y2="50%">
                     <stop offset="0%" stop-color="black" />
                     <stop offset="100%" stop-color="white" />
                   </linearGradient>
                 </defs>
-                <polyline id='pl' points='0,0 255,0' stroke='url(#lg)' stroke-width='4'/>
+                <polyline id='pl' points='0,64 255,64' stroke='url(#lg)' fill='url(#lg)' stroke-width='4'/>
               </svg>""")
             input_json = gr.JSON(value="{}", visible=False)
             html = gr.HTML(value="""<label for='zoom'>Zoom</label><input id='zoom' type='range' style='width:256px;height:1em;' min='0.157' max='1.57' step='0.001' oninput='