Hex Based Grid Help ...

BlitzMax Forums/BlitzMax Programming/Hex Based Grid Help ...

mic_pringle(Posted 2009) [#1]
Hi,

Could anyone offer any help on how to achieve rendering the type of grid seen on the following web page http://www.incitti.com/atomhex/ - the specific screenshot I'm referring to is 2 across and 2 down in the screenshot section.

Not only would I like to know how to go about drawing the grid (which needs to fill the screen) but also how to blend the colors. As you can see in the image, parts of the grid are red, parts are yellow and parts are white and they all blend.

Thanks in advance

-Mic


Brucey(Posted 2009) [#2]
This is the one I used as a base for my own hex stuff : http://www-cs-students.stanford.edu/~amitp/Articles/Hexagon1.html

Rather that than work the way mainsworthy did which was to render the entire grid as a single image - which was kind of novel, I thought :-)


Brucey(Posted 2009) [#3]
more : http://www-cs-students.stanford.edu/~amitp/gameprog.html#hex


mic_pringle(Posted 2009) [#4]
@Brucey

Thanks for these.

I'm going to spend my time reading through them now, but having quickly scanned over them they don't give an insight on the colour blending part. Have you any thoughts on how this can be achieved ?

Thanks

-Mic


Brucey(Posted 2009) [#5]
My first thought would be to render the grid white to a texture, then draw that onto the buffer setting the four corner colours (of the texture) - causing a blending effect similar to those screenshots.

But not using the standard Max2D functions, for obvious reasons.


Otherwise, I'm sure someone else will come up with a much better solution.


_Skully(Posted 2009) [#6]
When drawing your hex lines why not adjust the color as you go...

Warning: very slow due to use of plot :)

SuperStrict
Global ScreenWidth:Int = 1024
Global ScreenHeight:Int = 768
Global ScreenDepth:Int = 0
Global screenRefresh:Int = 60
Global roll:Int=0
SetGraphicsDriver GLMax2DDriver()
Graphics ScreenWidth,ScreenHeight,ScreenDepth,screenRefresh
While Not KeyDown(KEY_ESCAPE) 
	For Local x:Int=0 To ScreenWidth
		For Local y:Int=0 To ScreenHeight
			SetColorByPos(x,y)
			Plot x,y
		Next
	Next
	roll:+10 Mod 255
	Flip
	Wend
WaitKey()

Function SetColorByPos(x:Int,y:Int)
	Global halfsw:Float=ScreenWidth/2
	Global halfsh:Float=ScreenHeight/2
	Local col:Float= ((Abs(Sqr((x-halfsw)^2+(y-halfsh)^2)/Sqr(ScreenWidth^2+ScreenHeight^2))*255)+roll) Mod 255
	SetColor col,col,col
End Function


obviously you would want to actually tie this concept to hue control and use some kind of anti-aliasing along the lines


Gib(Posted 2009) [#7]
To me it looks more like black hexes being drawn over a texture, gaps between the hexes showing the underlying texture.

I would create simple "rainbow image" in photoshop or gimp (I think gimp has a plasma cloud generator, or at least used to). Then create a hex image, draw a portion of hex grid (which tiles nicely) on to a 256x256 image and feather (feathering the edges of the black tiles will give the glow effect). In you game draw the "rainbow" image and scale rotate as desired, then tile the hex image across the screen, this would be fast and simple to render.

You could rotate and scale the "rainbow" image and play about with the grid effect (draw stars, boxes, diamonds etc. as long as the image tiles on 4 sides) to make up some nice original backdrops.


Ian Thompson(Posted 2009) [#8]
http://nehe.gamedev.net/data/lessons/lesson.asp?lesson=03

Vertex colour blending, will provide a smooth transition in polys and lines.