I should have made the shader editor bigger :p Hope you guys enjoy Going to be posting more game dev stuff here or on maybe a new channel. Subscribe for that if you are interested.
Nice tutorial! It is very helpful and its not covered many places. Although I find it annoying to transcript the code from the video so if anyone is lazy here it is: shader_type canvas_item; varying flat vec2 vertexPos[2]; uniform vec2 globalMousePos; void vertex() { vertexPos[0] = (MODEL_MATRIX * vec4(VERTEX, 0.0, 1.0)).xy; } void fragment() { // Place fragment code here. float isWithinY = step(vertexPos[0].y, globalMousePos.y) * step(globalMousePos.y, vertexPos[0].y + 64.); float isWithinX = step(vertexPos[0].x, globalMousePos.x) * step(globalMousePos.x, vertexPos[0].x + 64.); float isWithin = isWithinY * isWithinX; vec4 textureColor = texture(TEXTURE, UV); COLOR = mix(textureColor, vec4(0.7,0.,0.,1.0), 0.7* isWithin) ; }
Sick video I think maybe you could have dwelled on basic things (like how a vec4 can encode color via rgba). It’s not explicitly related to the main aim of the video, but since the shader in the video is relatively simple, it could double as a good intro to shaders as a whole if you explained basic concepts more thoroughly. Still really cool, though, and good explanation over-all. - co-developer :)
Yea when I was editing I wished I went more indepth into shaders since I felt like some of it assumed no knowledge, but other parts felt like you needed to have used them for a bit.
Very helpful tutoial! only the thing is i'm working with an isometric tileset and the position is slightly off. in my tilemap scipt i'm using the local mouse position, not the global one. Do you know how that would be possible within a shader?
Thanks! I haven't touched Godot or this shader in some time, but if you have a function that can check if a mouse position is within bounds of the isometric tile shape, then you'd need to replace the parts of the code that checks if the mouse is within bounds with that. Idk how local mouse position affects the script, but if you find out the bounds checks, then it should work. Sorry I can't be more helpful :p I think you might be able to make a matrix that takes an isometric position and makes it into square coordinates, and maybe then the shader trick I used would work (I might have one of these somewhere, but I'll have to get back to you later). Maybe there is a function someone made for this, or maybe you can do the cursed solution of making a system of inequalities with each line of the isometric tile shape, and then checking if the mouse position satisfies that (though this might be ugly to make into code lmao and is a very mathy solution). The solution that might work the best would probably be using a matrix to make the tile map coordinate into square somehow, or take the mouse position and make it into isometric. You can try to solve this on your own (which I encourage because it's learning) but also my explanation is really bad lol. Might make another reply later on something that can work for isometric.
Great video! But there is something weird happening in my project, checking if it is within x works great but within y does weird things, it highlights halves of cells in two rows instead of one full row of cells, do you have an idea why that is happening? The only difference I see in my project is the fact, that my cells are not squares but rectangles, I hoped that adding my cell size in places where you add 64 would work, but maybe this is the problem? Though, when I change the size to 64X64 it doesn't work either. Sorry for my english, but it's not my first language and I still have problem writing using it.
If your dimensions are different, then you should change 64 to the width of your cell for isWithinX, and change 64 to the height for isWithinY. It should work for rectangles but I haven't tested it specifically. I honestly can't tell why it only highlights half of a cell, it probably means that in the fragment shader, the coordinates it is checking for are probably wrong. What I would say for debugging is test each step function by setting COLOR.r to each specific step function. So for isWithinY that is step(vertexPos[0].y, globalMousePos.y) and step(globalMousePos.y, vertexPos[0].y + 64.).step(globalMousePos.y, vertexPos[0].y + 64.) If either of the two functions are not working as expected, then at least you know that that specific function is not working and try fixing that. If all of them work separately then its something else but I don't have enough context to try helping more.
@@TechJolt3d Sadly both functions are not working as expected (I didn't write this earlier but its half of a cell in diagonal, not horizontally which is weird to me), I don't think I have enough shader knowledge to fix them. Thanks for the answer anyway!
if you could make a series of checks that determines if your mouse is in a hexagonal space, then yes. How you would do that goes over my head. There are probably resources on finding if a point is within a hexagon, and you could just implement that logic into the shader.
