{"id":633,"date":"2009-12-09T18:00:06","date_gmt":"2009-12-09T23:00:06","guid":{"rendered":"http:\/\/poojanwagh.opalstacked.com\/poojanblog\/2009\/12\/weird-chrome-svg-bug\/"},"modified":"2009-12-09T18:00:06","modified_gmt":"2009-12-09T23:00:06","slug":"weird-chrome-svg-bug","status":"publish","type":"post","link":"https:\/\/poojanblog.com\/blog\/2009\/12\/weird-chrome-svg-bug\/","title":{"rendered":"Weird Chrome SVG bug"},"content":{"rendered":"

Google Chrome seems to have a bug in its rendering of SVG files. Here’s what it looks like:<\/p>\n

\"Chrome<\/a> <\/p>\n

Here’s what the same files look like under Firefox:<\/p>\n

\"Firefox<\/a> <\/p>\n

The HTML file I used to test this is:<\/p>\n

<<\/span>html<\/span>><\/span><\/div>\n
<\/span>  <<\/span>head<\/span>><\/span><\/div>\n
    <\/span><<\/span>title<\/span>><\/span>Test<\/span><\/<\/span>title<\/span>><\/span><\/div>\n
  <\/span><\/<\/span>head<\/span>><\/span><\/div>\n
  <\/span><<\/span>body<\/span>><\/span><\/div>\n
    <\/span><<\/span>p<\/span>><\/span>The received in-phase is <\/span><<\/span>object <\/span>type<\/span>="image\/svg+xml"<\/span> data<\/span>="665dd30fd32270d75e7871a23e9ae2b3.svg"<\/span>><\/<\/span>object<\/span>><\/span>and the quadrature is…<\/span><\/<\/span>p<\/span>><\/span><\/div>\n
  <\/span><\/<\/span>body<\/span>><\/span><\/div>\n
<\/<\/span>html<\/span>><\/span> <\/span><\/div>\n

The embedded SVG file is:<\/p>\n

<?<\/span>xml version="1.0" encoding="utf-8"<\/span>?><\/span><\/div>\n
<<\/span>svg:svg <\/span>width<\/span>="9.485391pt"<\/span> xmlns:svg<\/span>="http:\/\/www.w3.org\/2000\/svg"<\/span> viewBox<\/span>="0 -8.332031 9.485391 12.854414"<\/span> xmlns:svgmath<\/span>="http:\/\/www.grigoriev.ru\/svgmath"<\/span> height<\/span>="12.854414pt"<\/span>><<\/span>svg:metadata<\/span>><<\/span>svgmath:metrics <\/span>top<\/span>="9.8251171875"<\/span> bottom<\/span>="1.8387890625"<\/span> baseline<\/span>="4.5223828125"<\/span> axis<\/span>="8.5067578125"<\/span>\/><\/<\/span>svg:metadata<\/span>><<\/span>svg:text <\/span>font-size<\/span>="12.000000"<\/span> text-anchor<\/span>="middle"<\/span> y<\/span>="0.000000"<\/span> x<\/span>="3.061523"<\/span> font-family<\/span>="Times New Roman"<\/span> font-style<\/span>="italic"<\/span> fill<\/span>="black"<\/span>><\/span>x<\/span><\/<\/span>svg:text<\/span>><<\/span>svg:g <\/span>transform<\/span>="translate(5.724609, 2.683594)"<\/span>><<\/span>svg:text <\/span>font-size<\/span>="8.520000"<\/span> text-anchor<\/span>="middle"<\/span> y<\/span>="0.000000"<\/span> x<\/span>="1.684863"<\/span> font-family<\/span>="Times New Roman"<\/span> font-style<\/span>="italic"<\/span> fill<\/span>="black"<\/span>><\/span>I<\/span><\/<\/span>svg:text<\/span>><\/<\/span>svg:g<\/span>><\/<\/span>svg:svg<\/span>><\/span> <\/span><\/div>\n

I’m basically trying to support MathML with SVG as a backup over at the circuit design site<\/a>. I guess the 7% of visitors that use Chrome will have to deal.<\/p>\n","protected":false},"excerpt":{"rendered":"

Google Chrome seems to have a bug in its rendering of SVG files. Here’s what it looks like: Here’s what the same files look like under Firefox: The HTML file I used to test this is: <html>   <head>     <title>Test<\/title>   <\/head>   <body>     <p>The received in-phase is <object type="image\/svg+xml" data="665dd30fd32270d75e7871a23e9ae2b3.svg"><\/object>and the quadrature […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[6],"tags":[189,191,188,190],"class_list":["post-633","post","type-post","status-publish","format-standard","hentry","category-web","tag-html","tag-mathml","tag-svg","tag-web-development"],"jetpack_featured_media_url":"","jetpack_likes_enabled":true,"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/posts\/633","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/comments?post=633"}],"version-history":[{"count":0,"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/posts\/633\/revisions"}],"wp:attachment":[{"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/media?parent=633"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/categories?post=633"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/poojanblog.com\/blog\/wp-json\/wp\/v2\/tags?post=633"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}