Having issues with the displayed z-axis with the draw_line() function

Archive
1
:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By grymjack

As you can see from the linked picture I am having issues with the lines for the bounding box being drawn behind the stars. If you look a little further to the left, you will see the ‘Drawing’ node at the very bottom of the node list. The attached script is what renders the red lined box. I would like the lines to appear in front of the stars to give the appearance of being inside the box. The objects themselves are duplicated from the original TextureRect using the code below. Any ideas? -Thanks

this is the code that creates the stars

# setting node name and performing operations
var temp_node = get_node(location_info.path + location_info.filename)
var my_copy = temp_node.duplicate()
add_child(my_copy)
my_copy.visible = true
my_copy.set_position(Vector2(box_x,box_y))
my_copy.rect_scale = Vector2(scale,scale)

this is some of the code that draws the lines for the box

# back box
draw_line(Vector2(30,185), Vector2(430, 185), Color(255, 0, 0), 1)
draw_line(Vector2(30,185), Vector2(30, 585), Color(255, 0, 0), 1)
2
:bust_in_silhouette: Reply From: ababen

since you are using just 1 node to draw all the lines, they all have the same z-index. you need to seperate it into multiple nodes, with the nodes you want in the front having higher z-index then those at the back

Thank you for answering. Being relatively new to Godot, could you give me an example of how would I draw lines with different nodes? I just call draw_line() with vectors and colors? Do you mean I have to attach scripts on several different nodes? If so, how will that be better than where I have the script now on the very bottom? Isn’t the position in the node tree indicate the z axis?

grymjack | 2023-03-29 21:43

hey, sorry for the late reply. the draw function is a function that exists in any 2D or control node. so you can use it at any of the nodes in your tree. if you are using godot 4, it is possible to use lambas instead of attaching a script to each node

var child_node = $Control
child.draw.connect(func(): draw_line())

on godot 4 it is also possible to set a z_index on control nodes, while in godot 3 it is only possible on 2D nodes.

and since you’re only drawing lines, another solution would be to use the Line2D node instead of the draw function. Line2D — Godot Engine (stable) documentation in English

ababen | 2023-04-04 07:29

Thanks again. I ended up using the Line2D solution. Here is the working clunky code chunk I used to draw the box. It is always helpful to me when people include the code that ended up working for them.

func draw_domain_box():
	# setting solid lines
	var solid_box = ([[Vector2(30,185), Vector2(30, 585)],
		[Vector2(30,585), Vector2(230, 735)],
		[Vector2(230, 735), Vector2(230,335)],
		[Vector2(230, 335), Vector2(30,185)],
		[Vector2(30,185), Vector2(430, 185)],
		[Vector2(430,185), Vector2(630, 335)],
		[Vector2(630, 335), Vector2(230,335)],
		[Vector2(230,735), Vector2(630, 735)],
		[Vector2(630, 735), Vector2(630,335)]])

	# setting dotted lines
	var dotted_box = ([[Vector2(430,185),Vector2(430,535)],
		[Vector2(430,585),Vector2(630, 735)],
		[Vector2(30,585),Vector2(430, 585)]])

	# drawing solid lines
	var line = get_node('DomainBox/SolidLine')
	for loop in range(0,solid_box.size()):
		createLine(solid_box[loop][0], solid_box[loop][1],line)
		
	# drawing dotted lines
	createDottedLine(dotted_box[0][0], dotted_box[0][1],1,12)
	createDottedLine(dotted_box[1][0], dotted_box[1][1],13,11)
	createDottedLine(dotted_box[2][0], dotted_box[2][1],25,11)

func createLine(from, to, line):
	# drawing solid line
	line.add_point(from)
	line.add_point(to)

func createDottedLine(from, to, line_counter, loop_counter):
	# calculating xy changes
	var x_distance = (to.x - from.x)
	var y_distance = (to.y - from.y)

	# setting starting position
	var x_current = from.x
	var y_current = from.y

	# creating dotted lines
	for loop in range(0,loop_counter):
		# setting dotted control line to use
		var dotted_line = get_node('DomainBox/DottedLine' + str(line_counter + loop))

		# setting start/finish positions
		var x_start = x_current
		var x_finish = (x_start + (x_distance/32))
		var y_start = y_current
		var y_finish = (y_start + (y_distance/32))

		# drawing line
		dotted_line.add_point(Vector2(x_start,y_start))
		dotted_line.add_point(Vector2(x_finish,y_finish))

		# incrementing positions, adding gap 
		x_current = x_finish + (x_distance/16)
		y_current = y_finish + (y_distance/16)

grymjack | 2023-04-04 18:56