Author |
Topic |
Ken Randall
33 Posts |
Posted - Mar 19 2022 : 07:53:48
|
Hi,
How can I do this so that it is not a base64 image?
Thanks,
Ken
Ken R |
|
xequte
38610 Posts |
Posted - Mar 20 2022 : 18:55:16
|
Hi Ken
Is there a reason you don't you want it base64 encoded?
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 21 2022 : 06:10:43
|
Hi Nigel,
Sorry, what I meant is a rescalable SVG rather than one that just includes the image as a bitmap.
Ken R |
|
|
xequte
38610 Posts |
|
Ken Randall
33 Posts |
Posted - Mar 22 2022 : 05:28:10
|
Hi Nigel,
Is this a possible enhancement to ImageEn? There are lots of online sites that attempt to create an SVG from a PNG file including ImageMagick.
Ken R |
|
|
xequte
38610 Posts |
Posted - Mar 23 2022 : 02:27:09
|
Hi Ken
I don't believe that could be done very well. Can you link to an example of what you mean.
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 23 2022 : 05:40:24
|
Hi Nigel,
This is one of them: https://convertio.co/png-svg
The result is only in black and white but it is a start.
Regards,
Ken R |
|
|
xequte
38610 Posts |
Posted - Mar 23 2022 : 17:29:52
|
Huh, that is not actually terrible.
I suppose if I needed to do it, the process would be something like:
- reduce the colors in the image - find all the color regions and output them to paths
Of course, it would need a lot of optimizing to get it to perform agreeably.
Have you tried using Potrace and/or AutoTrace via ImageMagick to see what that give you? Your app could always do it that way in the background.
ImageMagick used to just convert the image to a series of pixel circles. But that creates huge slow files:
const
SVG_Opening_Tag = '<svg width="%dpx" height="%dpx" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">';
SVG_Closing_Tag = '</svg>';
SVG_Circle_Tag = '<circle cx="%d" cy="%d" r="1" fill="rgb(%d,%d,%d)"/>';
var
ss : TStringList;
x, y: Integer;
pPix: PRGB;
begin
ss := TStringList.create();
try
ss.Add( format( SVG_Opening_Tag, [ bmp.Width, bmp.Height ]));
for y := 0 to bmp.Height - 1 do
begin
pPix := bmp.ScanLine[ y ];
for x := 0 to bmp.Width - 1 do
begin
ss.Add( format( SVG_Circle_Tag, [ x, y, pPix^.R, pPix^.G, pPix^.B ]));
inc( pPix );
end;
end;
ss.Add( SVG_Closing_Tag );
ss.SaveToFile( DestFilename );
finally
ss.Free;
end;
end;
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 24 2022 : 10:01:45
|
Hi Nigel,
Re: Have you tried using Potrace and/or AutoTrace via ImageMagick to see what that give you? Your app could always do it that way in the background.
Is there an existing demo that I can add this to?
Regards,
Ken R |
|
|
xequte
38610 Posts |
Posted - Mar 24 2022 : 16:49:28
|
Hi Ken
Not that I know of, but there is plenty of example code on the internet showing how to call ImageMagick from the command line.
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 25 2022 : 00:37:23
|
Hi Nigel,
I tried the code you gave. The original png is 106 KB and the resultant svg is 14 MB. On the good side it looks perfect!
Regards
Ken R |
|
|
xequte
38610 Posts |
Posted - Mar 25 2022 : 20:16:42
|
Hi Ken
Unfortunately it is a very inefficient way to do it and not truly vector (although it does "scale"). You should not use that method.
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 26 2022 : 06:29:32
|
Hi Nigel,
Any ideas on how this can be improved?
Regards,
Ken R |
|
|
xequte
38610 Posts |
Posted - Mar 27 2022 : 05:28:13
|
Hi Ken
Only to try using Potrace and/or AutoTrace via ImageMagick, or something similar.
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Mar 27 2022 : 12:39:59
|
Hi Nigel,
Potrace, with the default settings, creates a comparable svg to the one produced by convertio.co but slightly larger.
Regards,
Ken R |
|
|
Ken Randall
33 Posts |
Posted - Mar 29 2022 : 05:58:18
|
Works even better if I use mkbitmap first. Now for the next bit. How do I do this for each color in my png combining them into one svg the same as Inkscape does?
Ken R |
|
|
xequte
38610 Posts |
|
Ken Randall
33 Posts |
Posted - Apr 02 2022 : 08:55:24
|
Hi Nigel,
I'm struggling with how to do 3. Create a copy of the image containing only each color (e.g. by making a copy of the bitmap, iterating the bitmap scanlines and excluding each pixel that does not match the current color).
Could you please give me an example of how I would use it in conjunction with step 2.
Thanks,
Ken R |
|
|
xequte
38610 Posts |
Posted - Apr 02 2022 : 21:19:11
|
Hi Ken
// Make all pixels white that don't match a color
var
x, y: Integer;
pPix: PRGB;
begin
for y := 0 to ImageEnView1.IEBitmap.Height - 1 do
begin
pPix := ImageEnView1.IEBitmap.ScanLine[ y ];
for x := 0 to ImageEnView1.IEBitmap.Width - 1 do
begin
if ( pPix^.R <> MyColor.R ) or ( pPix^.G <> MyColor.R ) or ( pPix^.B <> MyColor.R ) then
begin
pPix^.R := 255;
pPix^.G := 255;
pPix^.B := 255;
end;
inc( pPix );
end;
end;
ImageEnView1.Update();
end;
Nigel Xequte Software www.imageen.com
|
|
|
Ken Randall
33 Posts |
Posted - Apr 03 2022 : 09:51:24
|
Hi Nigel,
This ends up with very big files more-or-less the equivalent of doing ss.Add( format( SVG_Circle_Tag, [ x, y, pPix^.R, pPix^.G, pPix^.B ])) for each pixel.
Is there any way you can think of improving it?
Thanks,
Ken R |
|
|
xequte
38610 Posts |
Posted - Apr 03 2022 : 18:57:30
|
Hi Ken
The more colors you include, the closer it will come to the pixel-as-ellipse result. You want very few colors, e.g. less than 64, and ideally something like 16. Other than that, I have no other suggestions,
Nigel Xequte Software www.imageen.com
|
|
|
Topic |
|