Injecting data into SVG with more than 10000 chars with jQuery
Hi there. This is my first post, so if I do stupid stuff, don't hesitate to tell me. I'm a noob in this community. If you want to read my introductory text, scroll below.
I currently work on a project with many SVGs as external documents with text.
Among others I want to use a certain font (in woff format) in all SVGs.
In the way the SVGs are currently embedded in the website it appears that linking to an external font is no solution, but only if the font data is embedded within the SVG i.e. it's no problem to link an external font file into an SVG if the SVG is displayed directly in the browser, but not so if it's embedded within a webpage. There I have to rely on embedding the font into the SVGs by using
To avoid overhead by loading the same data for each SVG and as the font may change over the course of the project (which would require changing all SVGs) I came up with the idea of injecting that font data at runtime into all SVGs.
Any ideas on this?
Personal introduction text
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
var font='[URL="http://pastebin.com/dadzDcUj"]<Long base64 string here, which I link through pastebin, as it exceeds the message limit>[/URL]';
var data = '<style type="text/css"> \n\
src: url("data:application/font-woff;charset=utf-8;base64,'+font+'"); \n\
<div id="svgload" style="width: 100%; height: 300px;">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<rect id="idRect1" fill="#FF0000" width="300" height="300"/>
<text id="idText1" x="20" y="20" font-family="Ostrich" font-size="20px" fill="black">Hello!</text>
<div id="btnTest">Click Me!</div>
I have a computer science MSc with a good background in usability and web development. I currently work partially as a freelance web developer. I considered joining a message board on web development, as I was more used to kind of a closer community in my "previous" online life, than it is currently implemented e.g. with StackOverflow. I think StackOverflow has it's uses, but I probably need something else for now and try it with the "closer community" approach. If I break forum rules, don't hesitate to tell me (but yes, I follow common netiquette anyway). As said I'm still a community noob and deem no intentional harm.