Editing Creating the SVG

The first step in making a map is create an SVG file.  This SVG file defines what the map looks like, where the territories are, what their shapes are, as well as the "bonus link" rectangles that show the bonus values.

You can use any SVG editor you want.  Many graphic design applications have the ability to export to SVG, so if you're already familiar with one you may use that.  If you don't know what to use, try Inkscape. Inkscape is a good choice since it's free, works across all of the major operating systems, and is overall very nice application. You can download it at http://inkscape.org. 

It's a good idea to test your SVG file as you are building it. Don't wait until you've spent a bunch of time building the perfect map before uploading it into WarLight the first time.  You want to make sure the tools and techniques you are using will work with WarLight, as WarLight [[SVG Limitations|doesn't support some SVG features]].

==Getting Started==

After opening Inkscape, you should do a few things to set up your document:

* Set the background to black: This is so it fits in with WarLight's theme. Click "Document Properties" (top-rightmost button, or shift-control-D) and click the "Background" (under the default "Page" tab). Set the R,B, and G to 0 and the A to 255 to get black.
* Set the document size: Go back to "Document Properties" and under "Custom Size" set the Width and Height to about 900. Ensure the units says px (for pixels). You can adjust the size for your own map's needs. (Note about map sizes: Most maps work best when they're less than 1000x1000. If army numbers appear too small when you test your map, that means your map is too big and had to be shrunken down, causing the army numbers to shrink. Thanks to the magic of SVG, you can reduce the size of your map without losing any detail. If you're making a super large map, note that the maximum map size is 3330x2440.)

Then just start drawing, using Inkscape's drawing tools.  For learning how to draw in Inkscape, there are many good tutorials on the web.  Try searching with search engines or on Youtube.

==Assign Territories==

As you are drawing, you will need to designate which objects will be player-controllable territories and which are just for decoration. To mark an object as a player-controllable territory, give it a id of Territory_#. For example, Territory_1, Territory_2, Territory_3, etc. To do this in Inkscape, right-click on the object and select "Object Properties." Then set the "ID" to Territory_1. 

Inkscape will tell you if you try to re-use the same number more than once (it will say "id exists!"), so you don't need to pay super close attention to where you left off in the numbering. Also, you don't need to use every number - it's okay to jump around (for example, skipping from Territory_11 to Territory_19.) This is also good if you decide to delete one; you don't need to go back and fill in the gap. 

Anything that doesn't start with Territory_ won't be a territory, so you can include extra objects for decoration or instruction, such as lines, arrows, etc.

If you're making a really large map, note that maps may not contain more than 3200 territories.

==Starting from an image==

If you're modeling your map after something you have an image of, it's often helpful to insert an image, set its opacity to 50% and just draw over the top of it.  The image itself won't show up when you upload it to WarLight.

To insert an image in Inkscape, just drag the image file into your canvas. Then, you can move it to the back by selecting Object -> Lower to Bottom. You can adjust its opacity by selecting Object -> Fill and Stroke.

==Overridden Properties==

WarLight will override a few properties of each player-controllable territory. Therefore, it does not matter what you set for these properties when designing the map, since the values will be overwritten when the map is used in a real game:

* Fill color: The fill color will be replaced with the color of the player who controls the territory
* Stroke color (border color): The stroke color will be replaced with the color of the bonus the territory belongs to (you'll set these colors for each bonus later)
* Stroke width (border width): The stroke width will always be 1.

Player-controllable territories are "brought to the front." That is, you can't overlap a player-controllable territory with another object and expect it to stay that way. 

Further, player-controllable territories should not overlap each other - you don't want to have territories that players can't click on.  If you want a territory to be on top of another, you really need to cut a hole in the outer territory in the shape of the inner one.  This makes the inner one look like it's on top, even though technically the territories aren't overlapping. In Inkscape, one way to do this is with Path > Flatten (keybind shift+F).

==Bonus Links==

You can make a small "bonus link" rectangle that shows the number of armies a bonus gives. This is preferred over making your own rectangles with a number in them for two reasons:

* If players click on the bonus link, it selects the bonus.
* If players override the value of the bonus, the game will show the correct number.

To make a bonus link, make an object near the bonus.  A 16x16 rectangle is the standard, but some players prefer to use circles or other artistic styles.  Give the object an ID of BonusLink_BonusName. Remove any spaces or punctuation, special letters (like the ß), letters of any other alphabet then the latin alphabet, or letters with diacritics (such as ë, î, ú) from the bonus name. For example, the Earth map has a bonus named "Middle East" and the rectangle's name is "BonusLink_MiddleEast". Be sure to use the same casing; for example, bonuslink_middleeast would not work.

If you are not sure what to name your bonus link box, WarLight will help you out. After uploading your SVG file and creating the bonuses in the map designer, open the Bonuses window and look at the text. The Bonuses window will tell you what to name your Bonus Link rectangle.  If you've named the object correctly, but WarLight still isn't recognizing it, it may be because your bonus link is a group (a "g" node in the svg file.)  Only individual objects can be bonus links, not groups.  To fix this, in Inkscape, just right-click the offending object and select "Ungroup."

The fill color of a bonus link will be set to the color assigned to the bonus.  The stroke color of the bonus link will always be set to yellow, and this color is not overridable.  However, the yellow stroke can be hidden by setting the stroke opacity to zero.



== Including Text ==

To include text in your SVG file, please follow the approach below. After doing this, your text will behave as an object. If you need to modify what the text says, you must delete and re-create the object. 

* Make the text using the text tool in Inkscape.
* Arrange the text exactly as you want it.
* Select the text.
* Select Path -> Object to Path

==See also==

* [[Map Making]]

[[Category:Map Making]]