I want to make a button which when clicked will show the xy coordinates of the points the user clicks with the mouse on an image. So far I have done this but it does not work:\[code\]<script>var data_str = '{ "source": {' + '"name":' + '[' + '[' + pts_0[0][0] + ',' + pts_0[0][1] + '],' + '[' + pts_0[1][0] + ',' + pts_0[1][1] + '],' + '[' + pts_0[2][0] + ',' + pts_0[2][1] + ']' + '],' '} }' ; </script><pre id='mydata'></pre><script>document.getElementById('display-button').onclick = function (){var data_el = document.getElementByID('mydata');data_el.innerHTML = data_str;}</script>\[/code\]When the button is clicked it should show something like this: \[code\]{ "source": { "name": "myface.png", "points": [ ["10","23"], ["7","100"], ["77","11"] ] },\[/code\]