Nanonano Posted January 21, 2012 Share Posted January 21, 2012 I have included a SVG-file into the html-page with the embed-tag, like this: index.html <!DOCTYPE html><html><head> <script type="text/javascript" src="jquery-1.7.1.js"/> function AJAX(){ $.post("UpdatePage.php",function (PhpParameter){ $("#SVGfile").html(PhpParameter); });} </head> <body> <div style="height:50px;width:50px;background-color:black;" onclick="AJAX()"/> <embed src="SVGimage.svg" type="image/svg+xml" /></body></html> The SVG-file looks like this: SVGimage.svg <?xml version="1.0" standalone="no"?> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <script type="text/ecmascript" xlink:href="Library.js"/> </svg> The Library.js -file contains a nessicary library to zoom and pan my SVGimage.svg document. Library.js uses the XML-DOM. I use jQuery's POST method together with a PHP-file, which retrieve data from the database and parse it back to the html-file. The problem is:I have stored information in a MySQL database telling what the SVG-picture should look like. How can I transfer this information into the embedded SVG-file? Unfortunatly, I can't used <svg> tags directly in the HTML-file, because the Library.js file is written for the XML-DOM. I didn't write it, and I'm not good enough to convert it into using the HTML-DOM. Any help is very welcome! This has turned out to be a huge headache. Link to comment Share on other sites More sharing options...
boen_robot Posted January 22, 2012 Share Posted January 22, 2012 Instead of linking to an SVG file, link to a PHP file, and use PHP to generate the SVG. To make sure the SVG appears properly, in the PHP file, you should start off with the MIME type, like: <?phpheader('Content-Type: image/svg+xml');?><?xml version="1.0" standalone="no"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <script type="text/ecmascript" xlink:href="Library.js"/><?php//Everything needed to actually generate the image here?></svg> Link to comment Share on other sites More sharing options...
Nanonano Posted January 22, 2012 Author Share Posted January 22, 2012 Thank you so must for answering. I tried your advice.In index.html I write the embedding with a php-extension, like this: <embed src="SVGimage.php" type="image/svg+xml" width="500" height="400" /> And my SVGimage.php looks like this: <?php session_start(); $FirstName = $_SESSION['GameName'][0]; $LastName = $_SESSION['GameName'][1]; $FullName = $FirstName . " " . $LastName; header('Content-Type: image/svg+xml');?><?xml version="1.0" standalone="no"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <script type="text/ecmascript" xlink:href="Library.js"/><?php echo "<rect x=\"50\" y=\"70\" rx=\"10\" ry=\"20\" width=\"90%\" height=\"150\" fill=\"red\" /> ";?> </svg> However, when I run the page like this, my Firefox want to install a plugin, and chrome complains about a syntax error on line 8 in SVGimage.php I tried to remove everything but src:"SVGimage.php" from the embed tag.I tried to remove the four "session"-lines from the beginning of the SVGimage.php.I also tried to use PHP's "include"-function, in case that was what you ment.Unfortunatly, none of the above worked. Any more help is still appreciated. Link to comment Share on other sites More sharing options...
boen_robot Posted January 22, 2012 Share Posted January 22, 2012 It's src="SVGimage.php" not src:"SVGimage.php Also, in your SVG, add <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN""http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> Link to comment Share on other sites More sharing options...
Nanonano Posted January 22, 2012 Author Share Posted January 22, 2012 Lets see how it works.. Link to comment Share on other sites More sharing options...
Nanonano Posted January 22, 2012 Author Share Posted January 22, 2012 Thanks again.So it should be like this? index.html <embed src="SVGimage.php" type="image/svg+xml" width="500" height="400" /> SVGimage.php <?php session_start(); $FirstName = $_SESSION['GameName'][0]; $LastName = $_SESSION['GameName'][1]; $FullName = $FirstName . " " . $LastName; header('Content-Type: image/svg+xml');?><?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" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <script type="text/ecmascript" xlink:href="Library.js"/> <?php echo "<rect x=\"50\" y=\"70\" rx=\"10\" ry=\"20\" width=\"90%\" height=\"150\" fill=\"red\" /> "; ?></svg> For some weird reason both IE and Chrome is complaining about a syntax error on line 8 (where the <xml>-tag is).I could understand why line 8 had an error earlier (since I had forgotten the <!DOCTYPE svg PUBLIC ....> tag)Firefox still wants to install a plug-in. I tried again to remove everything but the src="SVGimage.php" from the <embed> -tag.I also removed all the four "session"-lines from SVGimage.php, however then IE and Chrome were complaining about the same line where the <xml>-tag is.Any more ideas? I am really lost here. Thank you so much for helping. Link to comment Share on other sites More sharing options...
boen_robot Posted January 22, 2012 Share Posted January 22, 2012 Are you sure PHP is running on the server? Are you even running this in a web server to begin with? Open the SVGimage.php directly, right click, and select "View Source". If you can see the PHP code, then PHP is not running. Link to comment Share on other sites More sharing options...
Nanonano Posted January 22, 2012 Author Share Posted January 22, 2012 Hey.Yes, the server is running php, and I have used it with great success earlier, for example for retrieveing data from a database.I tried your suggestion to view source (good tip btw), and no php-code is shown there.What it says there is: <b>Parse error</b>: syntax error, unexpected T_STRING in <b>/www/clanteam.com/b/e/u/beurocity/htdocs/Gamepage/BuildCity.php</b> on line <b>8</b><br /> Link to comment Share on other sites More sharing options...
Nanonano Posted January 22, 2012 Author Share Posted January 22, 2012 I found a solution: SVGimage.html <?phpsession_start();$FirstName = $_SESSION['GameName'][0];$LastName = $_SESSION['GameName'][1];$FullName = $FirstName . " " . $LastName;header('Content-Type: image/svg+xml');print('<?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" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"> <script type="text/ecmascript" xlink:href="Library.js"/> <?php echo "<rect x=\"50\" y=\"70\" rx=\"10\" ry=\"20\" width=\"90%\" height=\"150\" fill=\"red\" /> ";?></svg> The <xml>-tag has to be wrapped in PHP's print() function. But thanks for all the help boen_robot !! Link to comment Share on other sites More sharing options...
boen_robot Posted January 22, 2012 Share Posted January 22, 2012 Ah, short opening tags... should've guessed that one. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.