Unit 2. The basics. Backgrounds. Nodes. Node data. Rotating and flipping objects. Reordering objects. Links. Interdiagram links

Transcription

1 Unit 2 The basics Unit 2 27

2 Unit 5 Unit 2 Unit 1 In which you will Launch netviz Start a new project Import a background Learn about the different background file types netviz can import Compare embedded and external backgrounds A background provides a visual reference on which you can arrange the elements of a diagram. When creating diagrams that show physical relationships, the first step is to import a background graphic. 28

3 Our objective is to document a hypothetical wide area network that spans the United States. We ll begin by creating a new project. 1. Launch netviz. If the netviz icon is on the computer s desktop, then doubleclick it. or Open the Windows Start menu. Open the Programs list. In the netviz folder, click netviz (the program s full title will depend on version and edition). Unit 2 Unit 1 netviz opens a window to help you get started. 2. Start a new project. Activate Create a New Project. Click OK. Unit 5 Press F10 to hide the palettes (we don t need them yet). 29

4 About backgrounds Unit 5 Unit 2 Unit 1 netviz supports a variety of image formats. For best performance, however, use WMF files. If you need to resize a background, import it as a free graphic using the Edit > Insert Graphic command. Then resize it by dragging a corner. You can create a graphic in netviz, export it (Diagram > Save As Graphic...), then import it as a background. Every new project starts out as a blank canvas, ready for you to create your masterpiece. For many diagrams, one of the first things you ll do is import a background. are graphics that provide a physical context for your diagrams. Typical backgrounds include: Maps Floor plans Pictures are different from the nodes, links, free text and draw shapes you ll use later to create diagrams: A background becomes, in effect, part of the page. Thus... A background cannot be selected, resized or changed in appearance once it is imported. (However, you can import a different background to replace one already in a diagram.) A background graphic will be proportionally resized to fill the area inside the page margins. By default, backgrounds become part of the project file. Later, we will discuss backgrounds in greater detail and see how backgrounds can be maintained as separate files. For this diagram at the Top Level of our project, we ll use a United States map as the background. 30

5 3. Import a background. Diagram > Background > Select.... Locate the c:\class directory. Click us.map. Set List Files of Type to netviz Map (map). The graphic you selected is previewed in the lower right corner of the window. This particular map is too dark, and other diagram elements may be difficult to see in front of it. In this window, you can change the background s appearance. Set Fill Color to Aqua. Unit 2 Unit 1 Click Open. You now see the entire page with the map background. Unit 5 Power user tip If you import a background and the image appears smaller than you expect, the graphic may be surrounded by unintended white space. Images exported from PowerPoint and AutoCAD, for example, suffer from this problem. To eliminate white space from an AutoCAD drawing, zoom all the way out and use the mouse to select only the section of the image you want. For PowerPoint graphics, expand the image to fill the entire page to minimize the white space around the image. Finally, save the image. 31

6 About graphic file formats Unit 5 Unit 2 Unit 1 Large background files not only consume greater disk storage, but also use more computer memory to display and take more time to load from disk and to draw. Try to keep background file sizes small. When choosing backgrounds, it helps to understand the different graphic formats. The netviz CD-ROM includes a variety of maps for use as backgrounds. Floor plans are sometimes available as CAD drawings. Pictures can include scanned photographs and photos made with digital cameras. The same background picture can vary in size depending on the format used to store the image. BMP is the most versatile format for Windows applications, but BMP files are also very large. You can also create your own background graphics using other programs. We suggest you use custom backgrounds in the Windows MetaFile (WMF) format or another vector format. Keep in mind that netviz supports these formats: wmf map png pct psd bmp gif pcd tga cmp nvm jpg tif ras cgm For diagrams that don t need a physical context, you can use corporate logos, borders or other graphics as backgrounds. Embedded versus unembedded backgrounds. netviz allows you to include all your background images in your project file to ease transport over a network or via . By default, netviz embeds your backgrounds. However, backgrounds tend to be large files and can make your projects exceptionally large. At your option, you can have netviz unembed backgrounds. netviz then makes copies of the background files outside the project (reducing project size) and reads them when they are needed to display diagrams. When unembedding backgrounds, be aware that netviz must have access to the background files when other people open your project. This is beneficial to users who are frequently update the background images and want netviz to always get the updated image, provided the file path and name are consistent. 32

7 More about backgrounds and pages. Here are some other things you should know (you don t have to do any of these now): To view and work on a diagram without seeing its background, you can temporarily hide it with the Diagram > Background > Hide command. You can move a background to the diagram s upper left corner by deactivating Diagram > Background > Center. Remove a background with the Diagram > Background > Clear command. If you d rather not work on a white page, you can change it to gray: Diagram > Display..., then activate Gray Page. If you d rather not work with page margins showing: Diagram > Display, then deactivate Show Page Margins. To learn more... About starting projects, see Project files in Part 3 of the netviz user s guide. About backgrounds, see Diagram pages in Part 3 of the netviz users guide. Making floor plans in Guide to documenting networks. Reducing visual clutter from backgrounds in Guide to documenting networks. Unit 5 Unit 2 Unit 1 33

8 Unit 2 Unit 1 In which you will Open an external catalog Create new nodes Move and resize nodes Open a subdiagram Add a title to a diagram Insert a graphic Zoom to fit Unit 5 are the primary building blocks of your project. They represent a wide range of things, from entire facilities to pieces of equipment to individual ports. You can only use nodes of the types shown in a catalog palette. If you need a node type that isn t in the project s Internal Catalog palette, you can add to the palette using several methods. You ll have a chance to do this later. 34

9 1. Open an external catalog. As stated in Unit 1, every project has an internal catalog. However, when you create a new project, its internal catalog is empty. To help you get started, netviz opens the External Catalogs Palette for the new project. When you use an object type from the External Catalogs Palette, netviz adds it to the project s internal catalog. Later, you ll learn other ways to add object types to the internal catalog. The External Catalogs Palette displays multiple external catalogs. netviz remembers the last five external catalogs you have used, enabling you to access them quickly. View > External Catalogs. Other ways to hide and show the palettes: use buttons in the right end of the tool bar; use the View menu to show and hide palettes; or use the keyboard shortcuts shown in the View menu. Unit 2 Unit 1 The External Catalogs Palette displays node types (in the top section) and link types (in the bottom section) contained in the _basic catalog. This is the default external catalog netviz provides for new projects. You ll see later how to change the default to another catalog. Unit 5 In the External Catalogs palette, click the Catalog Options button, then click Open More Catalogs... in the menu. Locate the c:\class directory. Select the Class.cat catalog, then click Open. The External Catalogs Palette now displays node types and link types defined in Class.cat. 2. Create a Data Center node. At this top level in the project, we will represent data centers in different cities. Scroll the upper section in the External Catalogs Palette to locate the Data Center node type. Using the mouse, drag a Data Center node type from the External Catalog Palette and drop it in the diagram. 35

10 Unit 2 Unit 1 To select a node in a diagram, click on it. Four small square handles appear at the node s corners. When a node is selected, you can drag it to a new position (move the cursor over its center first), resize it (by dragging a handle), apply different colors and carry out other actions on it. To deselect a node, click anywhere else in the diagram. Drag the new node to position it over Chicago on the map. 3. Create another Data Center node. As above, make a second Data Center node by dragging from the External Catalogs Palette. Drag this node to position it over Phoenix on the map. Unit 5 View > External Catalogs or F6 to hide the External Catalogs Palette. 4. Resize the nodes. Select one of the nodes, then drag a handle to enlarge the node. To return a node to its original proportions, SHIFT-drag a handle. When you drag to resize, the node retains its proportions its height and width change by the same percentage. To change a node s proportions, resize by CTRLdragging a handle. Select the other node and make it about the same size as the first one. 5. Rename the nodes. Double-click the text Data Center-1 next to the first node you created. Type Chicago Data Center, then press ENTER. Double-click the text Data Center-2 next to the other node. Type Phoenix Data Center, then press ENTER. 36

11 6. Expand a node to view its subdiagram. Double-click the Chicago Data Center node. You now see a new, blank diagram. This is Chicago s subdiagram, which will eventually show what is inside the Chicago Data Center. Notice that Chicago Data Center now appears in the Hierarchy Browser (left side of netviz window). There are four ways to open a subdiagram: Double-click node. Select node, CTRL-E. Select node, Object > Drill Down. Right-click node, click Drill Down in pop-up menu. Unit 2 Unit 1 The Chicago Data Center will be a parent to all objects placed in its subdiagram. We ll discuss these hierarchical relationships later. Click the Zoom Fit button to view the entire page. 7. Import a background for the Chicago subdiagram. Other ways to see the entire diagram: CTRL-W and View > Zoom > Fit to Window. Diagram > Background > Select.... Unit 5 Change Files of Type to Windows MetaFile (wmf). Select floorpl1.wmf in the c:\class directory, then click Preview. This file was exported from AutoCad. Notice the colors. Change the line color to gray. For many backgrounds, it s good to use lighter colors so the background won t visually overwhelm the nodes and links in the diagram. Click Open. 8. Add a title to this diagram. View > Draw Palette or F7. Drag the T from the Draw Palette and drop it in the diagram. Double-click the new text block. Type Chicago Data Center, then press ENTER. To force a line break in your text, press CTRL-ENTER. Close the Draw Palette. 37

12 Unit 2 Unit 1 Free text, draw shapes and inserted graphics are not nodes, and thus are not part of the project s structure. Also, they will not appear in searches. 9. Change the title s appearance. With the text block selected, Object > Font.... Set Size to 18. Set Text Color to Blue. Click OK. Drag the text block to the upper right corner of the page. 10. Insert a graphic. Let s add a logo graphic to this diagram. Edit > Insert Graphic.... Unit 5 Other ways to open the Text Format window: Right-click the text block, then click Font... in the pop-up menu. Change font, size, style and angle in the Inspector. Change Files of Type to Windows MetaFile (wmf). Select LOGO.wmf in the c:\class directory, then click Open. Make the logo smaller (about 50% of its original size) by dragging a handle. Drag the logo to the diagram s upper right corner below the title. Notice the small circle near the logo s upper left handle. This is called the rotation handle. This handle will allow you to rotate many objects (e.g., free text, vector graphics and most nodes) but not bitmap images, whether they are nodes or inserted graphics. The cursor changes to black when it s over the handle. If an object is too close the page margins, you may not be able to rotate it. To learn more... About creating and manipulating nodes, see and Line nodes in Part 3 the netviz user s guide. About free text blocks, see Text and graphics in Part 3 of the netviz user s guide. Formatting text in Guide to documenting networks. 38

13 In which you will Enter data using the Inspector Duplicate nodes The Inspector provides one way to enter data into an object s fields. After using it, you ll begin populating the Chicago Data Center diagram with nodes and links. Unit 2 Unit 1 Unit 5 39

14 Unit 2 Unit 1 The Chicago Data Center diagram is now ready to receive network components and connections. We ll first add some nodes and enter data for them. 1. Add a User Workstation node. Open the External Catalog Palette. Make sure its drop-down list is set to Class. Drag a User Workstation node from the External Catalog Palette and drop it in the diagram. Leave the new node selected. Close the External Catalog Palette. Unit 5 From now on, when you are directed to add a node to a diagram, open and close the appropriate palette as needed. 2. Enter data using the Inspector. Initially, the Inspector is docked in the lower left corner below the Hierarchy Browser. To undock the inspector, click the Inspector s Options button (far left in the Inspector s tool bar) and deactivate Docked. The Inspector displays all the data fields for the currently selected object. Use the Inspector to enter, view, edit and delete data in any field. Move the Inspector to the top right of the screen. Other ways to open the Inspector: CTRL-I, or click the Inspector button in the tool bar. To enter data: click in a field, type the data, then press TAB to move to the next field. With the User Workstation node still selected, type fictional data in the Inspector in the following fields: Name Mfg (manufacturer) Model User Name RAM (that is, memory size in MB) OS (that is, operating system) OS Version 40

15 3. Duplicate the node. Click on the node, press CTRL-C (same as Edit > Copy), then press CTRL-V (same as Edit > Paste). With this new node selected, press CTRL-D (same as Edit > Duplicate) until you have a total of 5 nodes. Drag the new nodes to position them as shown at right. Duplicating an object is the same as copy/paste, but duplicating is faster. Both methods duplicate not only the graphic symbol, but also its embedded data. Unit 2 Unit 1 4. Enter data for the new nodes. Using the Inspector, change the Name, Mfg, Model, User Name and RAM for the new nodes (click each node in turn to see its data in the Inspector). Make each workstation Name unique. 5. Set up the Inspector for AutoFit. You only need to go through this set up procedure once. Thereafter, AutoFit automatically resizes the Inspector so you don t need to scroll to see an object s fields in it (unless the Inspector is close to the bottom or right edge of the window). Unit 5 Move the Inspector to the center of the screen. Drag one of the Inspector s corners to make it fairly small. Click the Inspector s Options button, then click Set Minimum Size in the menu. Or if you prefer, you can have the Inspector stay below the hierarchy browser 6. Dock the Inspector To manually resize the Inspector: Drag any side or corner. To have the Inspector resize to fit fields: a. Resize Inspector to smallest practical size, then in Inspector s tool bar, Options > Set Minimum Size. b. In Inspector s tool bar, Options > Auto-Resize Inspector. To have fields resize to fit the Inspector: In the Inspector s tool bar, Options > Auto-Resize Fields. When entering large amounts of data in a field, use the Field Editor: in the Inspector s tool bar, Options > Edit Field.... Click the Inspector s Options button, then activate Docked. The Inspector now will stay under the Hierarchy Browser until you undock it. This way you will not have to move it around the screen as you add new nodes. The blue field in the Inspector is the key field. netviz uses data in the key field to distinguish objects from each other. For that reason it is important that each object s key field data is unique. Click on the diagram s background. Notice that the inspector now displays a summary of the diagram itself. It lists the number of nodes, links and free objects, and shows the background s name. 41

16 7. Add a Switch node to the diagram. Unit 5 Unit 2 Unit 1 Drag a Switch node from the External Catalogs Palette and drop it in the diagram. Place the Switch over the Server Room on the floorplan, then resize it to make it a little smaller. Using the Inspector, change its name to CHI_USER_SWITCH1. 8. Save and name the project. File > Save. Because this is the first time the project is being saved, the Save Project As window will appear. Set the drive and directory to c:\class. Enter the file name train1.net. (The default extension for netviz projects is.net; it will be automatically added as the file extension if you don t type it in.) Click Save. Periodically save this project. Now that it has a name, just press CTRL-S or click the Save button in the tool bar. The netviz title bar now displays the project s name and path. The project name also appears as the first entry in the Hierarchy Browser. 9. Rename the Top Level. By default, the first diagram in a project is called Top Level. In the Hierarchy Browser, right-click Top Level, then click Rename in the pop-up menu. Type U.S. WAN, then press ENTER. To learn more... About entering data, see Data entry and editing in Part 4 of the netviz user s guide. 42

17 In which you will Flip objects Rotate objects Unit 2 Unit 1 Rotation enables you to position objects at any angle which is sometimes needed to accurately represent real world positions. You can rotate single objects, multiple objects, groups and arrays. Unit 5 43

18 1. Rotate one of the User Workstations. Unit 2 Unit 1 Zoom in, then scroll to the diagram s upper left corner. Select one of the User Workstations. Click the node s rotation handle, then drag the mouse down. The node will rotate around it s center. Now hold down the CTRL key as you drag. This snaps rotation in 45 increments. 2. Rotate several nodes at once. SHIFT-click each User Workstation node. or Drag a selection box around all the User Workstations. Unit 5 To determine the exact angle of a rotated object, use the Object > Rotate/Flip > Angle... command. Object > Rotate/Flip. Rotation options include: Rotate Left (i.e., 90 counterclockwise). Rotate Right (i.e., 90 clockwise). Angle... (you select a preset angle or enter any desired angle). Try each rotation option and observe how the nodes rotate. After trying each option, Edit > Undo to restore the nodes to their original positions. 3. Rotate several nodes by dragging. With the nodes still selected, rotate them by dragging the rotation handle for the multi-object selection. Notice how the nodes rotate as though they are one object. Objects in groups behave this way also. Undo the rotation. 44

19 4. Flip a workstation. netviz enables you to change the orientation of nodes and other two-dimensional objects. Select a workstation node. Object > Rotate/Flip > Flip Horizontally, then Object > Rotate/Flip > Flip Vertically. Unit 2 Unit 1 Unit 5 45

20 Unit 2 Unit 1 In which you will Move one object in front of another Learn two more methods for zooming When you create an object, netviz puts it in front of other objects in the diagram. Often, this isn t obvious because the objects don t overlap. However, when two objects overlap you may want to move one in front of the other. Unit 5 46

21 1. Open the Top Level diagram. 2. Zoom in on Chicago. Place the cursor over the Chicago node. Right-drag diagonally (e.g., up and to the right). The box you create previews the area that will fill the screen. When the zoom box covers about half the United States, release the mouse button. Practice this method until you can confidently control the area you want to see zoomed in. 3. Create a Data Center for Gary, IN. Drag and drop a Data Center node from the Internal Catalog Palette. Right-click the new node, click Place, select Gary, IN in the Choose a Location list, activate Apply Name, then click OK. 4. Move Gary behind Chicago. Select the Gary Data Center. Object > Reorder > Move Backward. Move Backward (CTRL-DOWN ARROW) moves the selected object behind the object it overlaps. Send to Back (CTRL- PAGE DOWN) moves the selected object behind all objects on the page. Similarly, Move Forward (CTRL-UP ARROW) moves the selected object in front of the object overlapping it, while Send to Front (CTRL-PAGE UP) moves the selected object in front of all objects on the page. Unit 5 Unit 2 Unit 1 47

22 5. Zoom out using the navigator. Unit 2 Unit 1 View > navigator. The navigator enables you to zoom and pan the diagram. The red rectangle, called the zoom box, indicates the portion of the diagram showing in the window. Move the cursor over the center of the navigator s zoom box, then drag the box. Drag one of the zoom box s handles to make the zoom box larger. Close the navigator. Click the Zoom Fit button. Unit 5 48

23 In which you will Learn two techniques for creating links Use bend points to divide a link into segments Change a link s segments from straight to curved Move a link s attachment point Unit 2 Unit 1 are connections between nodes. A link will stay attached to a node, even when you move the node to a different spot in a diagram. Later, we ll see how these connections can provide a variety of information about relationships in your project. Unit 5 49

24 Unit 2 Unit 1 netviz provides two ways to connect nodes with links. First, we ll drag-and-drop from the palette, then use the CTRL-drag method. 1. Create a LAN Link. In the Hierarchy Browser, click Chicago Data Center. View > External Catalogs. The lower part of the External Catalogs Palette displays link types. In the External Catalogs Palette, locate the LAN Link type. When dragging a link from a Palette, you can save a step by dropping one end directly on a node. Drag the LAN Link from the Palette and drop it in the diagram away from the nodes. Unit 5 If you drop one of the link handles on a node as you drag it from the palette, it will connect automatically to that node. 2. Connect the new link to two nodes. When a link is selected, a handle is present at each end. Drag one of the link s handles and drop it on one of the workstation nodes. When the link s handle is over the node, the node changes color to let you know that you are about to establish a connection to it. Release the mouse button to attach the link to the node. To see that the link is really attached, drag the workstation around the link moves with it. Click the link to see its handles. Drag the link s free handle and drop it on the Switch node. Hide the External Catalogs Palette. Now we ll use the second method of linking nodes. 50

25 3. Create a link by CTRL-dragging. Press and hold the CTRL key, then drag the cursor from one of the workstations to the Switch. Release the mouse and CTRL key. As before, the Switch changes color to indicate that you can drop the link s end on it. Connect the remaining workstations to the Switch using this same technique. Click one of the links. In the Inspector, change the data rate field to Notice that this changes the link s thickness. There is a visual override set for this data field and data, and that override controls link thickness. We ll work more with visual overrides later in this unit. 4. Add a bend point to a link. Hold down the ALT key, then click on the link you just changed. A new handle appears where you clicked. This is a bend point. Use bend points to neatly route links around nodes and other links. Drag the new bend point to see how the link behaves. Add more bend points to the link and move them around. 5. Curve the link that has bend points. Right-click the link. In the pop-up menu, click Curve Lines. Drag the link s bend points to see how the curved segments move. Selecting a link type in the Link List also selects it in the Internal Catalog Palette, and vice versa. The link type showing in the Link List (or selected in the Palette) is the one that will be created whenever you CTRL-drag between nodes. To create a link of a different type, select the new type in the Link List (or Palette). To make link segments snap to horizontal/vertical, CTRLdrag a bend point. To delete a bend point, select it (it will be black when selected), then Edit > Delete or press DELETE. Unit 5 Unit 2 Unit 1 Other ways to curve links with bend points: CTRL-T, or Object > Curve Lines. To revert to straight segments: CTRL-T, or Object > Straighten Line Segments. 51

26 6. Add a Router node to the diagram. Unit 2 Unit 1 From the External Catalogs Palette, drag and drop a Router node in the diagram. Resize the new node, then position it below the Switch. Double-click the new node s name field, type CHI_RTR, then press ENTER. 7. Link the Router to the Switch. Using either technique you learned earlier, create a LAN Link between CHI_RTR and the switch. Change the link s Cable Type to Fiber. Notice that the link changes color. Unit 5 Right-clicking almost anything in a diagram (including empty spaces) opens a context-sensitive menu containing frequently-used commands. Take advantage of these menus to minimize trips to the menu bar. 52

27 8. Move the link s attachment point. By default, netviz draws links between node centers. You can override the default attachment point. The link connected to the switch and router might look more accurate if it appeared to connect ports on each device. Select the LAN Link connecting the switch and the router. CTRL-drag the link s end point so it is lies over one of the ports on the switch. Moving a link s attachment point sometimes improves neatness. Repeat on the LAN Link s router endpoint as desired. 9. Move the link above the nodes. By default, netviz draws new links behind the nodes it connects. There may be times when you want the link to be in front of those nodes. Right-click the LAN Link connecting the switch and router, then click Reorder > Above in the pop-up menu. Unit 5 Unit 2 Unit 1 This places the ends of the link above its nodes. Zoom in on the devices for a closer look. To learn more... About links and bend points, see and interdiagram links in Part 3 of the netviz user s guide. 53

28 Unit 5 Unit 2 Unit 1 In which you will Tile diagram windows Create interdiagram links Learn about reference nodes Learn how interdiagram links are represented throughout a project netviz enables you to represent your network in a hierarchical structure of diagrams. Upper level diagrams usually cover larger areas (countries, buildings, floors) but show few details. Diagrams lower in the hierarchy show smaller areas (rooms, equipment racks) with more details. Diagrams at the lowest levels typically show individual pieces of equipment. This hierarchical structure is a powerful tool because it lets you visualize your network over a tremendous scale. It also enables you to divide your documentation into multiple diagrams that are easy to work with (imagine how confusing it would be to have every network detail in one diagram!). We saw in the previous chapter how nodes in a diagram are connected with links. But how do we connect nodes that are in different diagrams? We use a netviz innovation called interdiagram links special links that begin in one diagram and end in another. The structure in our hypothetical network is just beginning to take shape. In this chapter, we ll expand the documentation with new diagrams and we ll add an interdiagram link to connect CHI_RTR with a new router in Phoenix. 54

29 We started a diagram showing the inside of Chicago. We ll now start a diagram showing the inside of Phoenix. 1. Go to the project s top level. Click U.S. WAN in the Hierarchy Browser (the left side of the netviz window). Another way to move up in the hierarchy: click the Go Up button in the tool bar. Unit 2 Unit 1 2. Drill down into the Phoenix node. Double-click Phoenix. When you drill down into a node, its subdiagram appears in a new window. 3. Import a floor plan as a background. Use the file floorpl2.wmf. Add a free text block from the Draw Palette to title this floor plan Phoenix Data Center. Change the title s appearance using Object > Font. Unit 5 4. Create five User Workstation nodes. Hint: Go back to the Chicago diagram, copy a workstation, then paste it here. Drag the workstations into separate rooms along the left side of the floor plan. Using the Inspector, enter different Name and User Name data for each workstation. 5. Create a switch node. View > Internal Catalog. Drop a switch node near the center of the floor plan. Name it PHX_USER_SWITCH1. 55

30 Unit 2 Unit 1 6. Connect the user workstations to the switch using LAN links. Use the CTRL-drag method or the drag-and-drop method. 7. Create a router node. Drop a router node below PHX_USER_SWITCH1. Rename the new node PHX_RTR. With PHX_RTR selected, click the Fill Color button select the desired color. and Unit 5 To add a node or link type from an external catalog, drop it anywhere in the netviz window. Connect this node to PHX_USER_SWITCH1 with a LAN Link. 8. Add a Circuit link to the Internal Catalog. If the Internal Catalog Palette isn t visible, F5 or View > Internal Catalog. If the External Catalogs Palette isn t visible, F6 or View > External Catalogs. Drag a Circuit link type from the External Catalogs Palette and drop it on the Internal Catalog Palette. The internal catalog now contains the Circuit link type. Note that the Internal Catalog Palette contains all the node types and link types you have used so far. When you place an object type from the External Catalogs Palette, or drag an object type from the External Catalogs Palette to the Internal Catalog Palette, that object type is added to the project s internal catalog. Press the F10 key to hide all palettes and the Inspector (if it s not docked). Look in the tool bar. Click the arrow by the Link list (to the left of the flashlight). Make sure the Circuit link type is selected. The Link list allows you to keep the Internal Catalog palette hidden, but still change link types easily. 56

31 9. View all three diagrams simultaneously. Window > Tile. There should only be three windows Phoenix, Top Level and Chicago within the netviz window. If you see any others, close them and tile again. If necessary, rearrange the diagram windows so Phoenix is on the left, U.S. WAN is in the center and Chicago is on the right. Scroll the Phoenix and Chicago windows so you can see the respective routers in each. Select the U.S. WAN diagram. Click or as needed to zoom this window in or out until you can see both Phoenix and Chicago. NOTE: You don t have to set up the windows this way every time you create an interdiagram link. This window arrangement makes it much easier to understand (for training purposes) what happens during interdiagram linking. 10. Connect the two routers with an interdiagram link. Make sure the Circuit link type is selected in the Link List. Watch very carefully as you... CTRL-drag to create a link from PHX_RTR in the tiled Phoenix window to CHI_RTR in the tiled Chicago window. When you release the mouse button, netviz draws links and creates new nodes (actually reference nodes) on its own. You must use the CTRL-drag method to create bottom-up links. If you d like to see this again, Edit > Undo, then Edit > Redo. Drilling down to open a subdiagram opens a new window, while clicking a diagram name in the Hierarchy Browser displays the diagram in the currently active window (replacing the diagram that was there). To open a diagram in a new window from the Browser, SHIFT-click its name. Unit 5 Unit 2 Unit 1 57

32 Unit 2 Unit 1 A reference node represents in one diagram what is at the other end of an interdiagram link (that is, the node in another diagram). Up close, a reference node symbol contains the same graphic as the node it represents, but the graphic is surrounded by a gray box. What you now see on-screen may seem confusing, so here s how to interpret it: What looks like three red links (one in each diagram) is really three instances of one interdiagram link. The Top Level diagram tells you that something in Phoenix is connected to something in Chicago. The Phoenix diagram tells you that PHX_RTR is connected to CHI_RTR (because CHI_RTR is a reference node, you know that it exists in another diagram). Unit 5 The Chicago diagram tells you that CHI_RTR is connected to PHX_RTR. More about interdiagram links The action you just performed is called bottom-up interdiagram linking because you link two lower level nodes and netviz automatically replicates the link at higher levels in the project. In a later chapter, you ll make an interdiagram link from the top down. Double-click a reference node to view the diagram containing the node it represents. You must use the CTRL-drag method to create bottom-up interdiagram links. Three diagrams were open so you could see the full effect of interdiagram linking. In practice, only the two diagrams containing the terminating nodes need to be open during bottomup interdiagram linking. An interdiagram link can pass through many levels of the project hierarchy. It will connect to a reference node in all diagrams except the one containing its top-most instance. Double-click an interdiagram link to view the diagram containing its top-most instance. A reference node helps you determine where the other end of an interdiagram link terminates. 58

33 11. Verify the relationship between a reference node and its original instance. This quick experiment drives home the point that a reference node is a separate instance of the node it represents. In the Chicago diagram, select CHI_RTR. Open the Fill Color palette in the tool bar, then click on a bright color (say, red). Notice that CHI_RTR reference node in the Phoenix diagram changes to the same color. CTRL-Z to undo the color change, if you prefer. To learn more... About interdiagram linking, see and interdiagram links in Part 3 of the netviz user s guide. A more detailed tutorial can be found in Part 9 of the netviz user s guide. For information about a reference node, hold the cursor over it. The status bar (bottom of netviz window) shows RN (indicating a reference node) and its location in the project hierarchy. Unit 5 Unit 2 Unit 1 59

34 Unit 2 Unit 1 netviz allows you to move objects from one diagram to another while maintaining links. In this chapter you will: Add a new subdiagram Move objects with interdiagram links to the new level You do not need to have your entire hierarchy worked out before you start the documentation. Using the move feature described in this chapter you can make changes to your hierarchy without having to re-do your work. Unit 5 60

35 To enable the documentation to effectively reflect the network s physical structure, the equipment in a wiring closet should be shown in a subdiagram below the floor plan, not in the floor plan diagram. 1. Add a wiring closet to Chicago. Maximize the Chicago diagram. Drag a Wiring Closet from the External Catalog palette and drop it on the Chicago Data Center diagram. Position it over a room and resize it appropriately. Rename the new Wiring Closet as Chicago Closet. 2. Add Chicago Closet to the Hierarchy. Double-click the new wiring closet. Double-clicking the wiring closet makes it appear in the Hierarchy Browser. A new window has opened to represent the new level. 3. Switch back to the Chicago diagram. In the Hierarchy Browser, click Chicago Data Center. Create wiring closets in different colors so they are easier to differentiate. Unit 5 Unit 2 Unit 1 4. Select the Switch and the Router. Hold down the SHIFT key and click the switch and the router. You do not need to select the links or the reference node, as they will move automatically. CTRL-drag a wiring closet handle to reshape it from a square to a rectangle. 61

36 5. Move the objects to the Chicago Closet. Unit 5 Unit 2 Unit 1 Drag the switch and the router to the Chicago Closet level in the Hierarchy Browser. You can also move objects between windows that are tiled. Release the mouse button. As you release the mouse button, the objects will move to the new diagram. Their links will go with them and reference nodes will be added/deleted where appropriate. Notice that the move changes the link s endpoint. Also, the move deletes bendpoints from links. You cannot move an object into its own subdiagram. Some interdiagram links may prevent you from moving an object because they would cause a violation of the interdiagram linking rules. For example, you cannot have an interdiagram link which connects an object to something directly below it in the hierarchy. You can always move objects up a level. This method of documenting the objects in the wiring closet at a level beneath the floorplan is a standard practice in LAN documentation created with netviz. The move is commonly used to relocate equipment from one diagram to another or to add or remove levels in the hierarchy. 6. Create a rack background. A rack background will provide a visual context for equipment in the Server Room. A background can t be selected, so you avoid problems when arranging the equipment over it. Also, this eliminates the possibility of having a duplicate name (if you are using the optional Rack object type). We don t have a rack background graphic, so we ll make one. In the Hierarchy Browser, click Temporary Workspace. 62

37 Open the class External Catalog palette, drag a rack node type onto the page, then close the External Catalog palette. Resize the rack so it fills the entire page. Object > Center > Both. Delete the text in the rack s label. If print templates are displayed: a. Diagram > Display.... b. Deactivate Print Template. c. Click OK. Diagram > Save as Graphic.... Navigate to the c:\class folder. Unit 2 Unit 1 Name the file Rack.wmf, then click Save. Return to the Chicago Closet diagram. Diagram > Background > Select.... Navigate to the c:\class folder and double-click Rack.wmf. 7. Repeat the process in Phoenix. In the Phoenix Data Center, add a Wiring Closet and create a subdiagram, then move PHX_USER_SWITCH1 and PHX_RTR to that new level. Unit 5 8. Save the project. Press CTRL-S or click the Save button in the tool bar. To learn more... About moving objects between diagrams, see the Modifying objects chapter in Part 3 of the netviz user s guide. 63

38 Unit 2 Unit 1 Interdiagram moving is a quick way to relocate any object from one diagram to another while preserving links between nodes. Besides making it easier to build projects, this feature streamlines change management (e.g., when someone moves to a room on a different floor, simply drag and drop their workstation and phone nodes to the new location). Select the objects you want to move, then drag and drop: n on the destination diagram s name in the Browser, or n in the destination diagram s window. Unit 5 : If interconnected nodes are reunited in one diagram, netviz removes their reference nodes (i.e., the reverse of the sequence shown here). netviz creates reference nodes, and interdiagram links, as needed. 64

39 In which you will Update a data-driven graphic field Observe the visual override Learn about uses for data-driven graphics Any data field can be set up to control an object s visual attributes: line width, line color, fill color or blinking. Changes made to data in such a field change the object s appearance. Blinking, for example, can help you quickly identify urgent conditions. In the last chapter, you used the Circuit link type to create an interdiagram link. The Circuit link type has been configured with visual overrides. Unit 5 Unit 2 Unit 1 Rotating objects 65

40 Unit 2 Unit 1 Let s see how data-driven graphics show up in a diagram. We ll first observe the effect in the Top Level diagram, then see how it appears in lower level diagrams. 1. Select a data-driven link. Open the Top Level diagram. Click the link connecting Phoenix and Chicago. Zoom in so the Circuit link takes up most of the window. Unit 5 2. Change data using the Inspector. In the Inspector, for the Data Rate field, select several different list items in turn. Watch the Circuit link s width and line style change. For the Type field, select several different list items. Watch the Circuit s color change. The Data Rate and Type fields have been configured with visual overrides to provide data-driven graphics. As the data rate increases, the link s width increases. When its type is changed, the link s color changes. With data-driven graphics, you can determine a Circuit link s data rate and type visually (line style and color) without using the Inspector. add an important dimension to complex documentation, enabling diagrams to reveal more information faster, which improves productivity. In a later chapter, you ll learn how to define the visual overrides that result in data-driven graphics. 66

41 3. Enter data in the Type field. In the Inspector, set Data Rate to T3. Click in the Type field. Type PVC, then press ENTER. Notice the Circuit link s color change this is the link type s default color. When you enter a value for which no visual override has been defined, the object will revert to its default appearance. Review exercise: Make a Miami Site. Create a Miami data center which uses Floorpl3.wmf as the background. Add four workstations and a wiring closet, then add a switch and a router in the wiring closet. Make interdiagram links of type Circuit from the Miami router to CHI_RTR. Remember the naming conventions we ve used so far? Be consistent here, too. 4. Save the project. Press CTRL-S or click the Save button in the tool bar. Unit 5 Unit 2 Unit 1 To learn more... About data-driven graphics, see in Part 4 of the netviz user s guide. Rotating objects 67

42 Unit 2 Unit 1 Unit summary You now know how to diagram a simple network in netviz. You can: Start a project and use external catalogs. Import a background graphic. Unit 5 Create and rename nodes. Resize, move and rotate nodes. Enter data using the Inspector. Insert graphics and add free text to diagrams. Connect nodes with links (using two methods). Add bend points to a link, and curve the link. Drill down into a node to view its subdiagram. Use interdiagram links to connect nodes in different diagrams. Move objects between diagrams. Use data-driven graphics. Navigate a project using reference nodes, interdiagram links and the hierarchy browser. 68

43 Review questions 1. How can you change the appearance of a background graphic? 2. How do you resize a node with the cursor? Unit 2 Unit 1 3. List three ways to open a subdiagram. 4. Describe two methods for creating links. Which method can be used to create a bottom-up interdiagram link? 5. How do you add a bend point to a link? 6. What are two uses for data-driven graphics? 7. What happens when you double-click a reference node? 8. How do you tile open diagrams? 9. List two ways to add an object type to a project s internal catalog. 10. What is the maximum number of external catalogs that can be simultaneously open in a single project? 11. Suppose there are two nodes A and B in the same diagram, and they are connected by a link. Can you move node B into a diagram subsidiary to diagram A? What if the link is an interdiagram link? That covers the basics things you ll use frequently in your documentation activities. But there s much more to learn. In the next unit, you ll learn about some of the advanced features in netviz. Unit 5 69