<svg> to <img> tags conversion

codrutoctavian · 02-15-2012, 06:34 PM

I am trying to convert epub -> mobi and the result is bad. I have to manually edit the html files and convert these tags:

<p id="d17437503631">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 516 338" width="100%">
<rect fill="#000007" height="338" width="516" x="0" y="0"/>
<image height="338" transform="translate(0 0)" width="516" xlink:href="images/9781569755730-text_0033_005.jpg"/>
</svg>
</p>

to:

<div class="center"><img src="images/9781569755730-text_0033_005.jpg" width="516" height="338" /></div>

there are hundreds of them.

As you can see I take from the <svg> tag the values of:

xlink:href="images/9781569755730-text_0033_005.jpg"

and the value of:

viewBox="0 0 516 338"

from which I take the 3rd and 4th values and use them to construct the <img> tag.

I know that this is difficult, but is there by chance a script which can interpret text and do this for me automatically?

Thanks

codrutoctavian · 02-15-2012, 09:58 PM

To answer my own question: I have used Textmate (a text editor for Mac) and I used regular expressions replacing:

<svg.*viewbox="0 0 (\d\d\d)\s(\d\d\d).*xlink:href="(.*)".*</svg>

with:

<div class="center"> <img src="$3" width="$1" height="$2" alt="$3"/></div>

I am posting here because maybe someone will hit the same issue someday.

02-15-2012, 06:34 PM	#1
codrutoctavian Enthusiast Posts: 37 Karma: 10 Join Date: Jul 2009 Location: Bucharest, Romania Device: Kindle 3	<svg> to <img> tags conversion I am trying to convert epub -> mobi and the result is bad. I have to manually edit the html files and convert these tags: <p id="d17437503631"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="100%" version="1.1" viewBox="0 0 516 338" width="100%"> <rect fill="#000007" height="338" width="516" x="0" y="0"/> <image height="338" transform="translate(0 0)" width="516" xlink:href="images/9781569755730-text_0033_005.jpg"/> </svg> </p> to: <div class="center"><img src="images/9781569755730-text_0033_005.jpg" width="516" height="338" /></div> there are hundreds of them. As you can see I take from the <svg> tag the values of: xlink:href="images/9781569755730-text_0033_005.jpg" and the value of: viewBox="0 0 516 338" from which I take the 3rd and 4th values and use them to construct the <img> tag. I know that this is difficult, but is there by chance a script which can interpret text and do this for me automatically? Thanks

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
<svg> to <img>	codrutoctavian	ePub	8	03-01-2012 08:54 PM
How to create tags by conversion?	siebert	Conversion	19	07-17-2011 04:43 PM
mobi to epub conversion - how do I change the img settings?	paola	Conversion	0	05-15-2011 02:22 PM
img alignment mobi conversion	c3hhej	Conversion	2	02-22-2011 02:06 PM
WIDTH and HEIGHT in <img> tags	Pablo	Sigil	3	06-10-2010 05:37 PM

02-15-2012, 09:58 PM	#2
codrutoctavian Enthusiast Posts: 37 Karma: 10 Join Date: Jul 2009 Location: Bucharest, Romania Device: Kindle 3	To answer my own question: I have used Textmate (a text editor for Mac) and I used regular expressions replacing: <svg.viewbox="0 0 (\d\d\d)\s(\d\d\d).xlink:href="(.)".</svg> with: <div class="center"> <img src="$3" width="$1" height="$2" alt="$3"/></div> I am posting here because maybe someone will hit the same issue someday.