This is a game example to show how to use a Marching Squares extension to display a fog of war with GDevelop. The source can be found directly in GDevelop in the examples list.

It uses a Marching Squares extension that allows to do operations on scalar fields without math or coding knowledge.

The Scalar Field Painter library is open-source.

The assets come from https://pixelfrog-assets.itch.io/

Open this game with GDevelop online editor

More information
StatusPrototype
PlatformsHTML5
AuthorD8H
Made withGDevelop, PixiJS
Code licenseMIT License

Comments

Log in with itch.io to leave a comment.

diathorn50 days ago

Hello. The function "change the field area bounds" doesnt seem to work

Reply
ChimaereJade105 days ago (1 edit)

Hey there,
thanks for all of your hard work! I was trying this technique yesterday and got some java-script related errors after a while:.

TypeError: Cannot read properties of undefined (reading '18')     
at ScalarField.GDJSInlineCode.ScalarField.extrapolate (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__definescalarfieldpainterlibrary-func.js:328:53)     
at HeightMap.GDJSInlineCode.HeightMap.getHeight (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__definescalarfieldpainterlibrary-func.js:920:37)     
at MarchingSquaresBehavior.GDJSInlineCode.prototype.containsPoint (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__marchingsquaresbehavior.js:216:35)     
at Object.GDJSInlineCode [as userFunc0xa371b8] (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__marchingsquaresbehavior.js:4353:46)     
at Object.gdjs.evtsExt__MarchingSquares__MarchingSquaresBehavior.MarchingSquaresBehavior.ContainsPointContext.eventsList0 (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__marchingsquaresbehavior.js:4363:111)     
at MarchingSquaresBehavior.gdjs.evtsExt__MarchingSquares__MarchingSquaresBehavior.MarchingSquaresBehavior.ContainsPoint (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/gdjs-evtsext__marchingsquares__marchingsquaresbehavior.js:4433:111)     
at Object.gdjs.level_95sceneCode.eventsList1 (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/code0.js:165:99)     
at Object.gdjs.level_95sceneCode.eventsList2 (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/code0.js:323:24)     
at Object.gdjs.level_95sceneCode.eventsList11 (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/code0.js:1136:107)     
at c.gdjs.level_95sceneCode.func [as _eventsFunction] (file:///C:/Users/MyName/AppData/Local/Temp/GDTMP--1/preview/code0.js:1588:24)

I would be really thankfull if you would know a way to fix this. I also would try to help you as good as possible.

Edit: Also I'm trying to figure out how I can improve the black screen-size further away from the screen.

Thanks anyway! :)

Reply
D8H88 days ago

Thank you for your feedback. The issue is fixed in the new version.

Reply
devncow1 year ago

Hello, how to have "square" cells and not round cells ?

For instance, to use in a tiled strategy game.

Thanks 

Reply
D8H50 days ago

I guess this other demo would better fit what you want: https://d8h.itch.io/tactical-movement-demo

Reply