Why svg imported by object tag are not all load in a HTML page?

hell

New Member
I have an html page where I have to load many many svg (more than 1000). I load each svg with this line:\[code\]<object type="image/svg+xml" data="http://stackoverflow.com/questions/12800232/89887295.svg">89887295 svg file missing</object>\[/code\]My svg are contain an ecmacscript like that for instance:\[code\]<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg"width="1203" height="50" onload="init(evt)"> <style> .caption{ font-size: 20px; font-family: Georgia, serif; } .tooltip{ font-size: 15px; } .tooltip_bg{ fill: white; stroke: black; stroke-width: 1.2; opacity: 0.85; } </style> <script type="text/ecmascript"> <![CDATA[ function init(evt) { if ( window.svgDocument == null ) { svgDocument = evt.target.ownerDocument; } tooltip = svgDocument.getElementById('tooltip'); tooltip_bg = svgDocument.getElementById('tooltip_bg'); } function ShowTooltip(evt, mouseovertext) { tooltip.setAttributeNS(null,"x",evt.pageX+11); tooltip.setAttributeNS(null,"y",evt.pageY+27); tooltip.firstChild.data = http://stackoverflow.com/questions/12800232/mouseovertext; tooltip.setAttributeNS(null,"visibility","visible"); length = tooltip.getComputedTextLength(); tooltip_bg.setAttributeNS(null,"width",length+8); tooltip_bg.setAttributeNS(null,"x",evt.pageX+8); tooltip_bg.setAttributeNS(null,"y",evt.pageY+14); tooltip_bg.setAttributeNS(null,"visibility","visibile"); } function HideTooltip(evt) { tooltip.setAttributeNS(null,"visibility","hidden"); tooltip_bg.setAttributeNS(null,"visibility","hidden"); } ]]> </script><rect x="0" y="20" width="1203" height="5"/><text x="50" y="10" style="font-size:7px;">50</text><text x="100" y="10" style="font-size:7px;">100</text><text x="150" y="10" style="font-size:7px;">150</text><text x="200" y="10" style="font-size:7px;">200</text><text x="250" y="10" style="font-size:7px;">250</text><text x="300" y="10" style="font-size:7px;">300</text><text x="350" y="10" style="font-size:7px;">350</text><text x="400" y="10" style="font-size:7px;">400</text><text x="450" y="10" style="font-size:7px;">450</text><text x="500" y="10" style="font-size:7px;">500</text><text x="550" y="10" style="font-size:7px;">550</text><text x="600" y="10" style="font-size:7px;">600</text><text x="650" y="10" style="font-size:7px;">650</text><text x="700" y="10" style="font-size:7px;">700</text><text x="750" y="10" style="font-size:7px;">750</text><text x="800" y="10" style="font-size:7px;">800</text><text x="850" y="10" style="font-size:7px;">850</text><text x="900" y="10" style="font-size:7px;">900</text><text x="950" y="10" style="font-size:7px;">950</text><text x="1000" y="10" style="font-size:7px;">1000</text><text x="1050" y="10" style="font-size:7px;">1050</text><text x="1100" y="10" style="font-size:7px;">1100</text><text x="1150" y="10" style="font-size:7px;">1150</text><text x="1200" y="10" style="font-size:7px;">1200</text><rect id="111-272" x="111" y="17" width="161" height="10" onmousemove="ShowTooltip(evt, 'YYYYYYYYYYYname')" onmouseout="HideTooltip(evt)" style="fill:Brown;" /><rect id="545-731" x="545" y="17" width="186" height="10" onmousemove="ShowTooltip(evt, 'XXXXXXXXXXXname')" onmouseout="HideTooltip(evt)" style="fill:LawnGreen;" /><line x1="1029" y1="10" x2="1141" y2="10" onmousemove="ShowTooltip(evt, '1029-1141 1e-16')" onmouseout="HideTooltip(evt)" style="fill:red;stroke:red;stroke-width:3;stroke-linecap:round;" /><line x1="884" y1="12" x2="981" y2="12" onmousemove="ShowTooltip(evt, '884-981 5e-16')" onmouseout="HideTooltip(evt)" style="fill:red;stroke:red;stroke-width:3;stroke-linecap:round;" /><rect class="tooltip_bg" id="tooltip_bg" x="0" y="0" rx="4" ry="4" width="55" height="17" visibility="hidden"/> <text class="tooltip" id="tooltip" x="0" y="0" visibility="hidden">Tooltip</text></svg>\[/code\]When I run my page html page with firefox or chrome I obtain the same problem. The first 200 svg (sometime less than 200 sometimes more...) are properly loaded and ecmascript works. But the other till the end are not loaded at all, I obtain the alt message... And the svg files are all present in the current directory.I think the issue is about the buffer of firefox which can't load everything, but how can I manage to load every svg?I tried to simplified my svg to be less larger, but when I export ecma script and call it in extern in the html page, svg in the object tag does not load it...Here are my 2 issues...I really need to load in the same page more than 1000 svg files I do not want to split in 2 or 3 pages...
 
Back
Top