Recent

Author Topic: [SOLVED] Projective transformation and the poor image quality  (Read 4082 times)

furious programming

  • Hero Member
  • *****
  • Posts: 853
[SOLVED] Projective transformation and the poor image quality
« on: August 17, 2020, 12:29:32 am »
I'm using a Graphics32 library to create a small tool, which should produce a miniatures based on flat source graphic, for the YouTube purposes. I'm using the TProjectiveTransformation class in a following way:

Code: Pascal  [Select][+][-]
  1. procedure TForm1.Button1Click(Sender: TObject);
  2. begin
  3.   FSourceImage.LoadFromFile('data\source.png');
  4.  
  5.   FTransformation.SrcRect := FloatRect(0, 0, 1024, 768);
  6.  
  7.   FTransformation.X0 := 0;
  8.   FTransformation.X1 := 1088;
  9.   FTransformation.X2 := 1024;
  10.   FTransformation.X3 := 192;
  11.  
  12.   FTransformation.Y0 := 176;
  13.   FTransformation.Y1 := -24;
  14.   FTransformation.Y2 := 768;
  15.   FTransformation.Y3 := 652;
  16.  
  17.   FDestImage.SetSize(1088, 782);
  18.   FDestImage.Clear($00000000);
  19.   FDestImage.BeginUpdate();
  20.  
  21.   Transform(FDestImage, FSourceImage, FTransformation, FRasterizer, Rect(0, 0, 1088, 782));
  22.  
  23.   FDestImage.EndUpdate();
  24.   FDestImage.SaveToFile('data\dest.bmp');
  25. end;

Currently I have a small test application — that's why the code in the OnClick event. As a result, I get correct image, the transformation is as I want. But the problem is the poor quality od the target image — it is sharp (pixelated) but should be "smooth", just like in the GIMP (by using "perspective" tool).

What can I do to improve the quality?

I never used this library before and I don't know how to do this. The documentation doesn't help very much. It says that I should use a sampler, but I don't even know how to create the instance of it. I tried with different rasterizers, but I achived no effect. I feel really stupid...

The test project is in the attachment. If anyone can solve this problem, I will be very grateful. The source and the dest images are also included in the attachments — you can see how ugly the target image is. 8)
« Last Edit: August 17, 2020, 06:47:41 pm by furious programming »
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Projective transformation and the poor image quality
« Reply #1 on: August 17, 2020, 01:15:48 am »
Well the original image is ugly too =)

Try bgrabitmap
https://wiki.lazarus.freepascal.org/BGRABitmap_tutorial_10

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: Projective transformation and the poor image quality
« Reply #2 on: August 17, 2020, 01:44:43 am »
Well the original image is ugly too =)

Can you explain why you think so?

Quote
Try bgrabitmap

I will, thanks. But I would also like to know how to solve this with Graphics32. 8)
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

winni

  • Hero Member
  • *****
  • Posts: 3197
Re: Projective transformation and the poor image quality
« Reply #3 on: August 17, 2020, 02:12:59 am »
Hi furious programming!

Lainz is right - the original is ugly.

But anyway:
I use the original to make a demo program how to use perspective mapping with BGRA.

Looks definitly better than yours.

Why do you insist on Graphics32?

Install the BGRAbitmapPack from the online package manager and then start my demo.

Winni
« Last Edit: August 17, 2020, 02:23:02 am by winni »

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Projective transformation and the poor image quality
« Reply #4 on: August 17, 2020, 03:28:16 am »
Well art is subjective, so my subjectivity doesn't like it.

I don't sell bgrabitmap so you can use anything, just my 2 cents.

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: Projective transformation and the poor image quality
« Reply #5 on: August 17, 2020, 03:29:42 am »
Lainz is right - the original is ugly.

Hmm… this is a kind of pixel art so it cannot be blurred by definition. 8-)

Quote
I use the original to make a demo program how to use perspective mapping with BGRA. Looks definitly better than yours.

Just because blur is used. But after transformation, with blur it still looks much better than without it — that's why I want it. But the whole thing is just to create video miniature only, based on an automatically generated screenshot during the game (that's what the source image is).

Quote
Why do you insist on Graphics32?

I am not insisting on this library, but since I have already started it would be nice to know such a solution.

Basically, I googled a bit about how to do the projective transformation using Free Pascal and there were some suggestions about this library (and none for the BGRABitmap package). Which library I use does not matter — as long as it performs the correct transformation (with a slight blur), crop the size according to the middle area of the given size and position and export it to PNG. All in the form of console application.

Quote
Install the BGRAbitmapPack from the online package manager and then start my demo.

Super, thank you both for the tips. 8)
« Last Edit: August 17, 2020, 03:48:11 am by furious programming »
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

winni

  • Hero Member
  • *****
  • Posts: 3197
Re: Projective transformation and the poor image quality
« Reply #6 on: August 17, 2020, 02:31:55 pm »
Hi!

With BGRA you can do nearly everything with antialising so you can create your own Tetris but without "stair" graphic.

For example there are:

* DrawLineAntialias
* EllipseAntialias
* DrawPolyLineAntialias
* RectangleAntialias
* RoundRectAntialias
* FillQuadPerspectiveMappingAntialias

and so much more.

With FillQuadPerspectiveMappingAntialias I created my demo.

Winni

lainz

  • Hero Member
  • *****
  • Posts: 4460
    • https://lainz.github.io/
Re: Projective transformation and the poor image quality
« Reply #7 on: August 17, 2020, 02:54:39 pm »
Using an emulator? Really interesting project.

It can be played in some way?

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: Projective transformation and the poor image quality
« Reply #8 on: August 17, 2020, 04:13:01 pm »
With BGRA you can do nearly everything with antialising so you can create your own Tetris but without "stair" graphic.

Of course, but I must play the original NES Tetris (played on FCEUX), but instead of recording poor and ugly (!) original game, I decided to make a layout with more modern style and record it. Thanks to this, viewers can see quite nice interface and see a lot of data that the original game doesn't show. But the graphics have to be pixelated — it's a 36-year-old retro game, after all.

I thought that the thumbnails for the published videos would be game frames, but instead of flat ones, let them have perspective. Previously, I did them manually in GIMP, but not only did it take some time, but each came out slightly different. Well, why do it manually, if I can write a small application that will convert the screenshot into a thumbnail — in a second. 8)


It can be played in some way?

In some way yes— that's why I created it. 8-)

See the example video — NES Tetris (NTSC) — 168,080 score (level 18-0). What you can see in the video is just a visualization. At the same time, I play the original game (on a laptop screen) on the FCEUX emulator, and Richtris (layout) renders the visualization in real time on an external monitor screen. The sounds you hear come from the emulator, while the input is read directly from the system (controller thumbnail in the lower left corner in the video).

In addition to rendering a nice visualization, Richtris does a lot of additional activities, including creates additional counters (gain score above input preview, pace below score, RNG quality and other meters in the lower right corner), and also stores an unlimited number of obtained results in configuration files. And after each game, it shows the statistics screen with a ton of different data.

Richtris is a response to the software used for the Classic Tetris® World Championship (see their example video — CTWC 2019 Quarterfinal match), but intended for single-player games for the purpose of recording. CTWC uses the original NES consoles and the layout renders based on the signal from the consoles. Richtris does the same, except it analyzes the contents of the emulator window and renders not only the gameplay, but all game scenes.

In the meantime, I'm working on a longer movie in which I will record with the camera what my PC station looks like while playing. Thanks to this, you will know what it is all about. But it will take some time.
« Last Edit: August 17, 2020, 05:17:52 pm by furious programming »
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: Projective transformation and the poor image quality
« Reply #9 on: August 17, 2020, 06:43:21 pm »
Ok, I did as you suggested — I used BGRABitmap and made a small test tool based on the test program from @winni (sources in the attachment). This is only the test program — now i need to create a small console app that load source image, perform transformation and crop, and then export the result to 24-bit PNG.

Use Load button to load the source image from the data\source.png file, Apply perspective to perform transformation and then the Save button to export the result to the data\dest.png file. For other platforms than Windows, change separators from \ to /.

This library is great and powerful, so thank you very much guys for help. :D
« Last Edit: August 17, 2020, 06:50:51 pm by furious programming »
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

winni

  • Hero Member
  • *****
  • Posts: 3197
Re: [SOLVED] Projective transformation and the poor image quality
« Reply #10 on: August 17, 2020, 06:53:06 pm »
Hi!

Nice.

One hint to simplyfy your code between the different Operating Systems:

Instead of / or \ use the const  DirectorySeparator
This is the correct sign for all OS.

Winni

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: [SOLVED] Projective transformation and the poor image quality
« Reply #11 on: August 17, 2020, 06:57:12 pm »
Yep, but usually I'm creating software for Windows platform only, and if I'm creating the test tool in a hurry, I'm not thinking about compatibility. However, for most purposes, I can use hardcoded / separators, because Windows supports both (with some exceptions).
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
Re: [SOLVED] Projective transformation and the poor image quality
« Reply #12 on: August 25, 2020, 12:32:31 pm »
Ah I am happy someone uses the FillQuadPerspectiveMappingAntialias function  :)
Conscience is the debugger of the mind

furious programming

  • Hero Member
  • *****
  • Posts: 853
Re: [SOLVED] Projective transformation and the poor image quality
« Reply #13 on: August 25, 2020, 05:09:05 pm »
@circular: but I had a strange problem with this function.

I've created a small console application and I copied the code responsible for load, transform and export the final image to disk file. For test I used the same source image file. And the result was white background (as on screenshot in my earlier post), but the dark transformed area was completely black (without any colors). I could not figured out why, so I just drop this console app and used my windowed test program.

Maybe this is a known problem, but maybe I did something wrong. However, I just copied the code from the windowed application, so it should work the same way. Strange.
Lazarus 3.2 with FPC 3.2.2, Windows 10 — all 64-bit

Working solo on an acrade, action/adventure game in retro style (pixelart), programming the engine and shell from scratch, using Free Pascal and SDL. Release planned in 2026.

circular

  • Hero Member
  • *****
  • Posts: 4196
    • Personal webpage
Re: [SOLVED] Projective transformation and the poor image quality
« Reply #14 on: August 25, 2020, 05:39:56 pm »
Hmmm, that could be related to the texture coordinates.
Conscience is the debugger of the mind

 

TinyPortal © 2005-2018