Making a Terraria like game, need help with an error

The code is stolen borrowed from @yoxd707. I put all the files into one file and now i get this error: can’t read properties of null (reading ‘fields’). I know it is because it tries to read something that doesen’t exist but my puny brain can’t handle JavaScript yet, let alone TypeScript.

Here is the code:

in: terrainGeneration.ts

3 Likes

I dont see no code

1 Like

And you had no better idea than to steal borrow an older version that had a worse performance, since it used sprites instead of tiles :rofl:

Later I will check what you did and maybe I can help you with the error…

1 Like

The file you made is fine but you missed calling the main function, you should do it before the game.onUpdateInterval and game.onUpdate events.

imagen

But the error actually comes from you didn’t create the grass, dirt and stone images in assets, they should be 8x8 px.

I tried to do it on a clone of your project but there seems to be a bug and it doesn’t work. So I recommend you to make a new one, first create the images in the asset and then add the file with the programming.

Good luck, keep me posted if any other issues arise :smile:

1 Like

neither do i

1 Like

Yea, i noticed that i used wrong when i edited your one to make a sprite with gravity and it phased through the ground…

Have been trying your newer codes.

And i am geniuenly impressed you can make procedural generation, in which i do not understand anytyhing :sweat_smile:

1 Like

I’m going to try to make it more “accessible”, although I have so much work that it can take time :face_with_spiral_eyes:
But it would be a good hobby to try to improve the project.
Try using something newer, though it will be much more difficult to understand :sweat_smile:

1 Like

I said in the post you have to go to terrrainGeneration.ts.

1 Like

Would it be possible if you made it an extension? Just a suggestion and then people like, wanting to use Noise for games, could use it in blocks

1 Like

Yesterday I made an extension so that perlin noise can be used, the idea would be to make another one for the generation of 2d terrains :upside_down_face:

2 Likes

How it work?

1 Like

The extension adds 5 functions, one in the Math section that would be the lerp function.
And another 4 functions in the Perlin Noise section, two functions for noise, 1D and 2D. And two functions for the Perlin Noise (FBM), 1D and 2D.
More documentation about it…
Simplex Noise
Perlin Noise

He has videos explaining the subject

2 Likes

I have two questions:

  1. How would i place tiles on the noiseMap

  2. What does this parameter do?
    image

Do you have a explanation on how to use them?

This extension only serves to generate “noise” (numbers from 0 to 1), how and what you use it for is up to your imagination.

The x and y coordinate parameters must contain decimals for correct operation, so I recommend multiplying those parameters by a scale.

I suppose that this parameter is that of the noise1d function, it is the necessary coordinate to calculate the noise at that point (the one that should be multiplied by a scale)

I am working on the extension that will be used to generate terrains in a simple way, but you can use the one that I left if you want to make your own implementation in something else.

I leave a quick example on how to use the noise1d and noise2d function:

1 Like

Wow your extention is relly impressive

2 Likes

i just made my first extention end added 2dNoise to it

Code Here
namespace SpriteKind {
    export const Temporary = SpriteKind.create()
}
let tempNum = 0
let TempImg = image.create(16, 16)
enum DegréesToRotate {
    clockwise = 1,
    counterclockwise = 2,
    dubbleClockwise = 3
}
enum Size {
    Whith = 1,
    Hight = 2
}
function PixelValue (X: number, Y: number, Image2: Image) {
    return (Image2.getPixel(X + 1, Y) + Image2.getPixel(X - 1, Y) + (Image2.getPixel(X, Y + 1) + Image2.getPixel(X, Y - 1)) + (Image2.getPixel(X + 1, Y + 1) + Image2.getPixel(X + 1, Y - 1) + (Image2.getPixel(X - 1, Y + 1) + Image2.getPixel(X - 1, Y - 1)))) / 8 
}
/**
 * Image Editor
 */
//% weight=49 color=#f1992b icon=""
namespace Image_Editor {
    /**
     * TODO: describe your function here,
     * @param myImage describe parameter here,
     * @param myImage2 describe parameter here,
     */
    //% block="draw $myImage onto $myImage2"
    //% myImage.shadow=screen_image_picker
    //% myImage2.shadow=screen_image_picker
    export function Print(myImage: Image, myImage2: Image): Image {
        let TempImg = myImage2.clone()
        for (let X = 0; X <= TempImg.width; X++) {
            for (let Y = 0; Y <= TempImg.height; Y++) {
                if (myImage.getPixel(X, Y) != 0) {
                    myImage2.setPixel(X, Y, myImage.getPixel(X, Y))
                }
            }
        }
        return myImage2
    }
}
namespace Image_Editor {
    /**
     * TODO: describe your function here, makes perline noise from en image
     * @param Image2 describe parameter here, the image to Create prerline noise
     * @param BlendingLevel describe parameter here, the Blending Level
     */
    //% block="noise image onto $Image2 Thicness $BlendingLevel"
    //% Image2.shadow=screen_image_picker
    //% BlendingLevel.number
    export function CreatePerline_image(Image2: Image, BlendingLevel: number) {
    for (let X = 0; X <= Image2.width; X++) {
        for (let Y = 0; Y <= Image2.height; Y++) { 
            if (X == 0 || Y == 0 || X == Image2.width - 1 || Y == Image2.height - 1) {
                Image2.setPixel(X, Y, randint(12, 16))
            } else {
                Image2.setPixel(X, Y, randint(3, 15))   
            }
        }
    }
    for (let Times = 0; Times <= 1; Times++) {
            for (let X2 = 0; X2 <= Image2.width; X2++) {
                Image2.setPixel(X2, Times * (Image2.height - 1), PixelValue(X2, Times * (Image2.height - 1), Image2) + 1)
            }
            for (let Y2 = 0; Y2 <= Image2.height; Y2++) {
                Image2.setPixel(Times * (Image2.width - 1), Y2, PixelValue(Times * (Image2.width - 1), Y2, Image2) + 1)    
            }
        }
    for (let Times = 0; Times < BlendingLevel; Times++) {
        for (let X2 = 0; X2 <= Image2.width - 3; X2++) {
            for (let Y2 = 0; Y2 <= Image2.height - 3; Y2++) {
                Image2.setPixel(X2 + 1, Y2 + 1, PixelValue(X2 + 1, Y2 + 1, Image2))
            }
        }
    }
    
    return Image2
    }
}
namespace Image_Editor {
    /**
     * TODO: describe your function here, rotate any square image
     * @param myImage describe parameter here, the image you want to rotate
    * @param Rotate describe parameter here, rotate it clockwise or counterclockwise
     */
    //% block="Rotate $myImage 90° $Rotate"
    //% myImage.shadow=screen_image_picker
    //% Rotate.enum

export function Rotate(myImage: Image, Rotate: DegréesToRotate): Image {
    let TempImg = image.create(myImage.width, myImage.height)
    if (Rotate == 1) {
       for (let X1 = 0; X1 <= TempImg.width; X1++) {
            for (let Y1 = 0; Y1 <= TempImg.height; Y1++) {
                TempImg.setPixel(X1, Y1, myImage.getPixel(myImage.height - Y1, X1))
            }
        }   
    } else if (Rotate == 2){
        for (let X2 = 0; X2 <= TempImg.width; X2++) {
            for (let Y2 = 0; Y2 <= TempImg.height; Y2++) {
                TempImg.setPixel(X2, Y2, myImage.getPixel(Y2, myImage.width - X2))
            }
        }
    }
    return TempImg 
    }
}
namespace Image_Editor {
    /**
     * TODO: describe your function here, find the width or the height of en image
     * @param image describe parameter here, the image you want to find the width or the height
    * @param size describe parameter here, Choose if you want to know the width or the height
     */
    //% block="$size of $MyImage "
    //% MyImage.shadow=screen_image_picker
    //% size.Size
// come back to this one 
    export function FindSizeOf(size: Size, MyImage: Image): number {
if (size == 1) {
    return MyImage.width
} else {
    return MyImage.height
}
    }
}
namespace Image_Editor {
    /**
     * TODO: describe your function here, maks a grid with your image
     * @param image describe parameter here, The image you want to make a grid of
     * @param Xtimes describe parameter here, the amont of times to place your image on the X axes
     * @param Ytimes describe parameter here, the amont of times to place your image on the Y axes
     */
    //% block="Grid of $imagE size x $Xtimes y $Ytimes"
    //% imagE.shadow=screen_image_picker
    //% Xtimes.Number
    //% Ytimes.Number
export function MakeGrid(imagE: Image, Xtimes: number, Ytimes: number): Image {
    let TempImg = image.create(imagE.width * Xtimes, imagE.height * Ytimes)
    for (let X = 0; X <= imagE.width * Xtimes; X++) {
        for (let Y = 0; Y <= imagE.height * Ytimes; Y++) {    
                TempImg.setPixel(X, Y, imagE.getPixel(X % imagE.width, Y % imagE.height))
            }  
        }
    return TempImg
    }
}

its not the best but its good

ya… i dont know how to use github