Because the best graphics is text
Home | Draw | Gallery | Help | Quick Reference
1.2 Saving a diagram for later editing
1.3 Emailing a diagram for editing by someone else
When drawing, move mouse over each link to display Tool Tips.
(1) Move the cursor to a cell
~~~~~~~~~~~~~ ~~~~~~~~~~~~~ ~~~~~~~~~~~~~ ~~~~~~~~~~~~~ ~~~~~~~~~~~~~ ~~~~~~~~~~~~~
(2) by clicking on the greeen arrow buttons
You can also press the "Shift" key and an arrow key at the same time, to move the cursor.
Press the "Ctrl" key and an arrow key at the same time, to move the cursor more quickly.
(3) At the yellow box, enter text for cell, then click on symbol to be inserted (Start, and Box in this example)
(5) To learn the other features, click on the links to see what happens. Click on "Undo" to undo any changes. It is easier to experiment with an existing diagram instead of a blank one, so start with one of the diagrams on the Gallery page.
A diagram's contents are in the URL. So, to save the diagram:
(1) Use your web browser to bookmark the page
or
(2) Copy and paste the URL into a file, reverse the process to retrieve the diagram at a later date. A URL will look something like this:
http://www.fossildraw.com/draw.php?txt_status=***+Busy+***&uact=cright&p1=1&text_cell=Internet&currow=1&curcol=1&font=3
&grid=off&cellh=5&cellw=11&line=single&mod=smpl&clpcrow=&clpccol=&clprow=&clpcol=&scrlrow=0&scrlcol=0&olduact=cup
&qaa=da0Internet&curtext=Internet&qba=ba0Firewall&qbb=ca0DMZ&qbc=pa0In%3D25%2C+Out%3D25&qbd=la0In%3D80%2C+443
&qca=da0Intranet&qcc=ba0Email+server&qcd=ba0Web+server&qda=ra0&qdb=ba0Web+proxy+server&p2=1
When pasting a URL back into a web browser, ensure that the URL is joined back into one long line. However, many word processing and email programs are smart enough to do this automatically for you if you click on the URL in the document or email. Test it out before starting on any complex diagrams.
If all else fails, you can use http://www.tinyurl.com to shrink the URL to make it easier to handle.
You can email the URL to other people using method (2) above. They will be able to view and edit the diagram just as you did, and email their new URL back to you with a changed diagram.
Click on "Print" to get a web page showing only the diagram. Use your mouse to mark the diagram, and your web browser to copy the marked text, then paste into your document.
In your document, use a fixed width font such as Courier, otherwise your diagram will look something like
| Internet | | | +---------+ In=25, In=80, | | DMZ |Firewall |----------------+----------+ | | Out=25 443 | +---------+ | | | +---------++---------+ Intranet |Email ||Web | | |server ||server | | | || | | +---------++---------+ | +---------+ | |Web proxy| +-----|server | | | | | +---------+
|
Instead of
|
Internet
|
|
|
+---------+ In=25, In=80,
| | DMZ
|Firewall |----------------+----------+
| | Out=25 443 |
+---------+ | |
| +---------++---------+
Intranet |Email ||Web |
| |server ||server |
| | || |
| +---------++---------+
| +---------+
| |Web proxy|
+-----|server |
| | |
| +---------+
|
Use your browser's Back button to recover from any program errors.
Advanced mode is similar to the default Simple mode, but with
(Some of the features explained below are also available in Simple Mode. There are placed here to keep the Simple Mode section short.)
If text is too long to fit in a box,
+---------+ |Escape | |HTML | |control | +characters to prevent embedding of HTML tags into input text.
you can increase the size of all cells by clicking on "Cell BIG".
+-----------------+ |Escape HTML | |control | |characters to | |prevent embedding| |of HTML tags into| |input text. | | | +-----------------+
but this will increase the total diagram size.
Another way is to use the "3sides R"
+---------- | | | +----------
and "3sides L" symbols
----------+
|
|
|
----------+
to form two joined cells. Text in the 3sides R box will automatically wrap into any adjoining 3sides L box.
+------------------------+ |Escape HTML control | |characters to prevent | |embedding of HTML tags | |into input text. | +------------------------+
Use a 2sides H symbol in the middle
-------------
-------------
to join 3 or more cells horizontally
+-------------------------------------+ |Escape HTML control characters to | |prevent embedding of HTML tags into | |input text. | | | +-------------------------------------+
For vertical stacks of cells, use the 3sides D, 2sides V, 3sides U; symbols
+-----------+ |Escape HTML| |control | |characters | |to prevent | |embedding | |of HTML | |tags into | |input text.| | | | | | | | | | | | | | | | | +-----------+
Cells can be joined either horizontally or vertically, but not both at the same time.
To draw a box within a box, use Corner sysmbols
| |
| |
+------ ------+ +------ ------+
| |
| |
| |
and Line symbols
|
|
------------- |
|
|
|
to surround a Box symbol
PC
+-----------------+
| |
| |
| +-------+ |
| |RAM | |
| | | |
| +-------+ |
| +-------+ |
| |CPU | |
| | | |
| +-------+ |
| |
+-----------------+
+-------------------------------------------- Cell row of cursor
| +------------------------------------ Cell column of cursor
| | +------------------------- Height of one cell, in characters
| | | +------------- Height of diagrams in cells (Rows)
| | | | +---------- Width of diagram in cells (Columns)
| | | | | +------ Height of diagram in characters
| | | | | | +--- Width of diagram in characters
| | | | | | |
Row=3 | Col=3 | Height=4 | Diagram=4R_4C, 16_36 |
PC
+-----------------+
| |
| |
| +-------+ | LAN
| |RAM | +-------------
| | | |
| +-------+ |
| +-------+~~~~|~~~~
| |CPU |~~~~|~~~~
| | |~~~~|~~~~
| +-------+~~~~|~~~~
| |
+-----------------+
To avoid using the mouse, tab cursor to Cmd text box at top left of page to enter commands, then hit <Enter>
Learn commands by watching text box contents after clicking on links with mouse.
You could also avoid the rodent by tabbing to each control, instead of using the Cmd text box, but that's a lot of tabs.
Home | Draw | Gallery | Help | Quick Reference