Differences

This shows you the differences between two versions of the page.

--- muszaki_informatika:raylib_vis_functions [2024/01/28 17:40] – knehez
+++ muszaki_informatika:raylib_vis_functions [2025/03/12 18:42] (current) – [Szinusz függvény ábrázolása 2D-ben] knehez
@@ Line 1: / Line 1: @@
-====== Szinusz függvény ábrázolása 2D-ben ======
+==== 2D alap kiinduló kód ====
+A következő programváz jó kiinduló pont a 2D grafikai fejlesztésekhez.
+<sxh c>
+#include <raylib.h>
+int main() {
+    // Initialization
+    const int screenWidth = 800;
+    const int screenHeight = 450;
+    InitWindow(screenWidth, screenHeight, "Graphics"); // ablak beállítása
+    SetTargetFPS(60); // Frissítési gyakoriság beállítása
+    while (!WindowShouldClose()) {
+        BeginDrawing();
+            ClearBackground(RAYWHITE);
+            /// ide jön a saját kódunk
+        EndDrawing();
+    }
+    CloseWindow();
+    return 0;
+}
+</sxh>
+==== Szinusz függvény ábrázolása 2D-ben ====
 Az alábbi rövid példa egy szinusz függvény ábrázolását mutatja.
@@ Line 57: / Line 83: @@
     return 0;
 }
+</sxh>
 A 6. és 7. sorban megadjuk a képernyő méretet pixelekben. Ezt a két értéket kapja meg paraméterként az //InitWindow()// függvény.
@@ Line 68: / Line 95: @@
 A 34. sortól azért számoljuk át az értékeket, mert a koordináta rendszer kezdőpontja valójában a bal felső sarokban van és a függőleges tengely fentről lefelé növekszik.
+==== Egyszerűsített függvényábrázolás pixelekkel ====
+Próbáljuk meg pixelenként kirajzolni a függvényt:
+<sxh c>
+#include <raylib.h>
+#include <math.h>
+int main() {
+    const int screenWidth = 800;
+    const int screenHeight = 450;
+    InitWindow(screenWidth, screenHeight, "Sinus Function Plot - raylib");
+    SetTargetFPS(60);
+    Vector2 origin = {(float)screenWidth / 2, (float)screenHeight / 2};
+    while (!WindowShouldClose()) {
+        BeginDrawing();
+        ClearBackground(RAYWHITE);
+        DrawLine(origin.x, 0, origin.x, screenHeight, BLACK);
+        DrawLine(0, origin.y, screenWidth, origin.y, BLACK);
+        for (int x = 0; x < screenWidth; x++) {
+            float y = origin.y - sinf((x - origin.x) * DEG2RAD) * 100;
+            DrawPixel(x, (int)y, BLUE);
+        }
+        DrawText("Sinus Function Plot", 10, 10, 20, BLACK);
+        DrawText("X-Axis", screenWidth - 50, origin.y + 10, 10, BLACK);
+        DrawText("Y-Axis", origin.x + 10, 10, 10, BLACK);
+        EndDrawing();
+    }
+    CloseWindow();
+    return 0;
+}
 </sxh>
+A módszer lényege a középen lévő for ciklus:
+<sxh c>
+        for (int x = 0; x < screenWidth; x++) {
+            float y = origin.y - sinf((x - origin.x) * DEG2RAD) * 100;
+            DrawPixel(x, (int)y, BLUE);
+        }
+</sxh>
+Most a szinusz függvényt jelentettük meg, ami c-ben a ''sinf(x)'', ezt úgy kell használni, hogy az argumentumát eltoljuk a kép közepére, ezért van kivonva az origin.x belőle, majd beszorozzuk a fok-radián átalakító konstanssal: ''sinf( (x - origin.x) * DEG2RAD)''
+A módszer hátránya: amennyiben a függvény függőlegesen sokat változik, ameddig 1 pixellel jobbra lépünk akkor az eredmény pontozott lesz, nem lesz összefüggő vonal. Próbáljuk ki a **tanf()** függvénnyel.
+megjegyzés: //lényeges, hogy mindkét módszer jó lehet, számonkérésnél a rövidebbet érdemes alkalmazni.//
+===== Térbeli ábrázolás =====
 A következő példa egy kétváltozós függvényt **sinf(sqrtf(x*x + y*y))** térben ábrázol