Displaying images in SVG inside HTML

As part of a hackweek project for visualising the number of people at London Tube stations, we have an SVG image linked to with a standard tag in HTML. This svg file is generated by PHP, and includes an tag importing the tube 开发者_JAVA技巧map and some tags. When viewed directly, this works fine. However, when viewing the HTML page containing the SVG, only the circles are displayed, not the imported image. This is the same with any image, not just a tube map. Anyone know what the problem is, or if it's a limitation of SVG?

It's not a limitation in svg, but it's hard to say exactly what's wrong from your description. Note that Webkit-based browsers (Safari, Chrome) have a known issue with transparency in <object> tags, so take note and test in other browsers too.

Have you tried using http://raphaeljs.com/ - It sounds like it might be exactly what you're looking for.

The demo section even includes an svg graphic that gets drawn to a page