javascript - Why resizing an image does not work in d3.js? -


problem statement :

suppose height of image h , width of image w. enter image description here

now, start increasing width in code. suppose first change width of image w+q. happens width of image changes. enter image description here

if increase width of image w+q+p, width of image not change instead image shifts in page (i don't know why happens because x , y fixed, height , width changing.) enter image description here width of image increases when increase height of image.

enter image description here

this code.

<!doctype html> <html> <head>   <meta charset="utf-8">   <script src="http://d3js.org/d3.v3.min.js"></script>     <style>         .chotu{             color: 'white';         }     </style>     <script type="text/javascript">         function draw(data) {         var w = 500;         var h = 400;         var svg = d3.select("body")                 .append("svg")                 .attr("width", w)                 .attr("height", h);         svg.append('svg:image')                     .attr('xlink:href', 'grass.jpg')                     .attr('x',100)                     .attr('y',200)                     .attr('width',250)                     .attr('height',100)                     .attr('class','pinku');       }     </script>    </head> <body>     <script type="text/javascript">     d3.tsv('data.tsv',draw)     </script> </body> </html> 

can tell me how can resolve issue? new java script , d3.js.


Comments

Popular posts from this blog

What is happening when Matlab is starting a "parallel pool"? -

angular - DownloadURL return null in below code -

php - Cannot override Laravel Spark authentication with own implementation -