html - How do i scale svg <image> element to fill entire <svg> area? -

this jsfiddle.

<svg version="1.1"      xmlns="http://www.w3.org/2000/svg"      xmlns:xlink="http://www.w3.org/1999/xlink"      width="400px"      height="400px"      viewbox="0 0 1000 1000"      preserveaspectratio="none"      style="border: 1px solid black;">      <image x="0" y="0"              width="1000"              height="1000"             xlink:href="http://www.bized.co.uk/sites/bized/modules/bized_cb_navigation/images/floorplan_info.gif">     </image> </svg> 

1. my actual drawing area 400px x 400px.
2. i define coordinate system on of (0,0) (1000,1000).
3. i set image x=0 y=0 width=1000 height=1000
4. the image should fill way 0 1000 on x , y axis.

except 4. doesn't happen - can see there white-space left left , right. missing?

set

<image … preserveaspectratio="none"></image> 

just setting value in svg tag not enough