Example: Use Repeating Images to Fill Areas

Areas are often filled with bitmap images that form a seamless pattern when tiled.  If we like, we can use any bitmap image that can be used as a symbol, which will repeat within the area.



We Alt-click the area using blue squiggles, to pick it as the context object for the Info pane.  



A border showing coordinates of the area as small boxes appears.  The Info pane automatically pops open to show that area's information.  



In the Style tab of the Info pane, we click the Symbol button.   In the drop down menu we choose More to see the full Symbol dialog.



The Symbol dialog shows the Current choice.  We have set a white background color for the preview pane.  We click the collections picker button and choose Image.



We right-click into the Images grid that appears, and choose Add.   That launches the Import dialog.



We navigate to the folder where our images are saved, we Ctrl-click two images, and we press Import.  Note that the "palm tree" image has two visible figures, that is, two palm trees appear in the image, while the "missile" image has only one missile in the image.   Note also that the "missile" image appears in two versions: one version has a larger region of transparent pixels surrounding the visible pixels that show a missile.    The other version is cropped more closely to the region of visible pixels.  


When used as a point style, we would prefer the more closely cropped image, since there is no point in a point style to carry around broad regions of transparent pixels.  When used as an area style, on the contrary we might prefer an image that surrounded the visible figure with a broad region of transparent regions: when such images are tiled together to form a "fill" pattern the extra margin of transparent pixels will provide wider separation between the repeating figures.



The imported images appear as symbol choices in the Images grid.   We click on the "missile" image and press OK.    


Back in the Info pane, we press Update Record.



The image appears in use in the Provinces layer for the designated area.   We have double-clicked off the Cities and Cities Labels tabs, to provide a simpler illustration, and then clicked back onto the Provinces tab to make it the active layer.


The pattern we see is caused by the image we imported being repeated over and over using the Size factor given to scale the image.   Because there is only one visible figure in the image we used (just one missile), the pattern is stiffly repetitive with all the images lined up vertically and horizontally.   That is a useful effect for some images, but not for others.


The area is still picked, so in the Info pane Style tab we once again click the Symbol button and then drill down into the full Symbol dialog.



We click the collections picker, choose Images, and then in the Images grid we choose the palm tree symbol.  Press OK.   In the Info pane, press Update Record.



In the illustration above we have un-picked the area by pressed the Ctrl-Backspace key to eliminate the blue border.   When we tile the designated area using the "palm tree" image symbol, the palm trees appear in a less rigid pattern.  That is because the palm trees image we used has two trees in the image, arranged so that when the image is tiled there is some alternation up and down and left and right in the pattern that emerges.


Note that in both the case of the "missile" symbol and the "palm tree" symbol the thematically formatted Fill color of the area shows through regions where the images have transparent pixels.   In both cases, the images use transparent pixels where figures or shadows are not drawn with opaque pixels or with partially transparent pixels.  Manifold correctly reckons such transparency, and allows the default fill color to show through transparent pixels.


If we use a bitmap image with no transparent pixels, as with the blue squiggles pattern or the agate image, then the default fill color cannot shine through.


For example, we can choose the bluetessel bitmap image for the area, and that will fill the entire area.



All style effects available for areas remain available when we use bitmap images as symbology.   For example, if we Alt-click the area and drill down into the Symbol dialog we can choose the Inner Border tab to turn on an inner border line with the settings seen below.



We use a simple line, not one that has repeating shapes, with rounded dashes five points in size that are separated by spaces five points in size.  The stroke color for the borderline is red, and we use a halo, with a very low padding so it just fills in the space parts of the line, in a black color.  The specification of border lines uses an interface similar to that used for the specification of line styles.



We use an Inner Border, because that will appear as we like regardless of the order in which areas are drawn.   The above is not an effect we would use every day, but it does illustrate the absolutely staggering range of options, with seemingly infinite possibilities, for producing dramatic graphics with great ease and speed.



For example, we can turn on the Cities and Cities Labels layers to show effects in layers above the Provinces layer, and the point symbols that use partial transparency in their shadows will render correctly, despite the complexity of the underlying bitmaps in the Provinces layer.



Images that tile seamlessly - There are many web sites which allow visitors to create images that tile to create seamless patterns.  The seamless patterns shown in this topic were created using the patterncooler.com web site, to help demonstrate what you can do with that site.  Visit, enjoy, create patterns of your own and support the effort by donating a few bucks so Harvey can keep creating more cool web sites.  Remember to buy a license for commercial use.



Manifold 9 - Style Pane Quickstart - Points - A fast and easy introduction to the new Style and formatting capabilities for Pionts in Manifold Release 9 and Viewer.  Learn how to rapidly change colors, symbology, sizes and rotations including the use of vector symbols, fonts and even bitmap images. The new system is "always on" and immediately shows changes in the main workspace for rapid, easy choice of exactly the visual effect we want.  This video gets right to the basics used every day.


Manifold 9 - Style Pane Quickstart - Lines - Learn how to use the spectacular new style capabilities for lines in Manifold Release 9 and Manifold Viewer to create an endless variety lines quickly and easily.  See how to add arrowheads or other symbols to the ends of lines, how to customize lines with repeating symbols, how to start lines with custom symbols and how to add accessory left and right lines for exactly the right effect.


Manifold 9 - Style Pane Quickstart - Areas - New area style capabilities in Release 9 and Viewer make it easy to rapidly create spectacular visuals that get the story across with clarity and compelling effect.  Learn how to use point and click controls to fill areas, control borders, draw "inner area" effects and "outer area" effects for a seeming infinite range of options, all available with a rapid click of the mouse.  Use bitmap images for area effects too!


Manifold 9 - Style Pane Quickstart - Labels - Recent builds of Release 9 have added extensive new style facilities for labels, making it easy to choose a wide variety of effects, including sidecar icons, box frames, drop shadows and many others. This video shows how fast and easy point-and-click dialogs make it easy to create exactly the label look you want.  Works for the free Manifold Viewer, too!


Manifold 9 - Bitmap Styles - A quick, first look at very extensive additions to Style, enabling use of bitmaps for styles, inner and outer area hatches, left and right line style additions and many other new features.


See Also







Info Pane


Style: Drawings


Style: Thematic Formatting


Style: Overrides


Style: Labels


Style: Areas


Style: Lines


Style: Points


Style: Bitmap Symbols


Style: Label Placement


Style: Label Icon Placement




Example: Change Point Style - Using new Style pane controls to change point style, either very rapidly one property at a time, or using the total Style button to compose a new style with changes to several properties at once.


Example: Style Pane Quickstart - A tutorial introduction to using the Style pane to apply color, symbology, size and rotation to areas, lines and points in drawings.


Example: Complex Point Style using a Circle Box - This example creates a complex point style, which uses a variety of different colors within the different effects tabs in the Point Style dialog.


Example: Point Style using Move and Rotate -  The Move parameter for symbols allows us to move symbols in an angular direction even as we rotate them.   This example shows how to create point symbols that are clock faces with hands, using Move and Rotate.


Example: Line Style with Multiple Effects -  We can use effects from all of the Line Style dialog tabs to create a more complex line style.  This example shows how to create a line style with an arrowhead symbol at the end of the line, a symbol at the beginning of the line and accessory lines in different colors to the left and right of the main line.


Example: Fill Areas with Bitmap Images - We can use bitmap images as "fill" symbology for areas, including for the fill of the area itself, or as fill for Inner or Outer effects.  In this example we use Style Overrides to fill different areas in a map of provinces with a different bitmap image pattern.


Example: Inner and Outer Effects using a Bitmap - The Inner and Outer effects with area styles can use bitmap images for fills.   We first illustrate an Outer effect using a bitmap, and then add an Inner effect.