# The 2D Display Region¶

There is one more DisplayRegion that Panda normally creates automatically for the main window. This is the 2-D DisplayRegion that renders the onscreen GUI or heads-up display. It is simply another DisplayRegion that covers the entire screen, like the 3-D DisplayRegion it layers on top of, except that its camera has an Orthographic Lens instead of a normal Perspective Lens.

This is the DisplayRegion associated with render2d, and is normally used to render all of the gui elements and onscreen text items you may lay on top of the screen.

If you are creating a secondary window or buffer, and you would like to layer 2-D elements on top of the screen, you can do so by simply creating a 2-D scene similar to render2d. Some sample code to do so is shown here:

dr = win.makeDisplayRegion()
dr.setSort(20)

myCamera2d = NodePath(Camera('myCam2d'))
lens = OrthographicLens()
lens.setFilmSize(2, 2)
lens.setNearFar(-1000, 1000)
myCamera2d.node().setLens(lens)

myRender2d = NodePath('myRender2d')
myRender2d.setDepthTest(False)
myRender2d.setDepthWrite(False)
myCamera2d.reparentTo(myRender2d)
dr.setCamera(myCamera2d)


The first group of commands creates a new DisplayRegion on the window and sets its sort value to 20, so that it will be drawn after the main DisplayRegion has been drawn. This is important in order to layer text on top of the 3-D scene, of course.

The second group of commands creates a camera with an OrthographicLens. The lens is created with a wide near/far clipping plane: -1000 to 1000. This probably doesn’t matter too much since we expect that everything we parent to this scene graph will have a Y value of 0 (which is easily between -1000 and 1000), but this allows us to accept a wide range of Y values.

The third group of commands sets up the myRender2d scene graph. It is just an ordinary node, with a few properties set on it, and the 2-D camera we have just created attached to it. We turn off the depth test and depth write properties because these are not important for a 2-D scene graph, and we don’t want them to get in the way of our gui elements.

## DirectGui in your new window¶

Note that if you wish to create any DirectGui elements, like buttons or other clickable widgets, in the new 2-D scene graph, and interact with them, you have just a bit more set-up to do. DirectGui has a special mechanism to connect it to the mouse pointer, which requires that all of its interactive objects be attached directly or indirectly to a PGTop node. In the default main window, this PGTop node is aspect2d, a special node created both to compensate for the non-square aspect ratio of the window, and also to be the special PGTop node required by DirectGui. If you are creating your own 2-D scene graph, you can create your own aspect2d node something like this:

aspectRatio = base.getAspectRatio()
myAspect2d = myRender2d.attachNewNode(PGTop('myAspect2d'))
myAspect2d.setScale(1.0 / aspectRatio, 1.0, 1.0)
myAspect2d.node().setMouseWatcher(base.mouseWatcherNode)