Share:

" /> Visio Guy » Text on a Circle Visio Shape
Home » Add-ins & Tools, Shapes

Text on a Circle Visio Shape

Submitted by on May 9, 2014 – 4:25 pm | | 15098 views 18 Comments

text-on-a-circle-shape-thumbMany Visio users would like to create graphics with text running around a circle. I’ve come up with a third iteration to solving this problem.

This time, you get a single shape, with no need for VBA macro code!

While Visio has no built-in way to put text on a circle, visguy.com has offered two work-arounds in the past. Maybe you’ve seen them: Circular Text Generator (version 1), Circular Text Generator (version 2).

Those solutions required the use of VBA macro code, which confused a lot of users, produced a disjoint set of shapes that needed to be used–and kept–together (further confusing users), and produced a static result. If you wanted new text-on-a-circle, you had to regenerate a new set of characters.

This latest version is now a single shape. You can edit the text on the shape to your heart’s consent. The only drawbacks to this version are that the number of characters are limited, resizing of the higher-character versions of the shape can be slow, and I’m only offering a four-character trial version for free (I have mouths to feed!)

Editing

Using the shape is quite simple. You just mix and match these actions:

  • Select and type, or double-click and edit existing text
  • Fine-tune settings by editing Shape Data fields or by right-clicking
  • Position text and background circles using control handles
  • Right-click and choose Update if anything goes wonky (this happens for larger amounts of text, jump to the Refresh section near the end of the article if you want more information)

The editing uses a trick I’ve used several times with other visguy.com offerings. The text you edit is actually invisible. You only see it while typing. Thereafter, subshapes within the group pick out individual characters, and rotate them properly:

editing

This adds the advantage that you don’t have to twist your neck oddly in order to read the text as you type.

Here’s an animated GIF I whipped up to give a feel of how it flows. Features will be explained in detail in the sections after.

text-on-a-circle-gif

Features

The easiest way to see all of the shape’s features is to look at the Shape Data panel. Here we can see six fields, with the possible values shown at right:

shape-dataLet’s go through each setting one by one, to get a better picture of how each field affects the look of your text on a circle shape.

Show Guides

The shape has guide-styled geometry that appears as blue dashed lines. These serve as visual references to help you configure the shape.

There are three guide elements:

  • Circle that the text rests upon
  • Crosshairs at the center of the circle
  • Clock-hand that shows the left/center/right side of the text, depending on the Text Alignment setting

The guides don’t show up when you print, or when you export the shapes to an image format or PDF. Nevertheless, you can turn them on or off with the Show Guides setting:

show-guides

One scenario where this is particularly useful is if you make presentations directly from within Visio. In that case, the guides might be a distraction. So you can simply select all the text-on-a-circle shapes, then use Shape Data to set Show Guides to False.

Text Orientation

Depending on where you place the text, and which direction your language goes, there are four logical orientations.

The setting makes more sense once you see an example of what can go “wrong”. Here we have the typical, default “Left-to-right Top” text. As we rotate the text around to the bottom of the shape, it becomes upside down and harder to read:

left-to-right-examples

If you have lots of text that goes all the way around the circle, you can’t avoid this situation entirely, unless you stack two different shapes on top of each other, with two different settings. In that case, you would set the top text to “Left-to-right Top”, and the text at the bottom to “Left-to right Bottom” as shown in the left column below:

text-orientationThe shapes in the right column say “Happy New Year” in Arabic (according to Google). Arabic uses a right-to-left writing system, so this is simply the mirror case of the shapes on the left.

Text Alignment

You position the text by adjusting a control handle that is always in the middle of the little blue guide-circle that lies along the radial clock-hand line. Using the Text Alignment setting, you can choose to have the text aligned by the left/start, center or right/end. As usual, the image makes a lot more sense than the text:

text-alignment

Text Baseline

The “baseline” of a font or line of text is the conceptual bottom, along which the characters are positioned. For typography types, it’s probably a super-important characteristic, worthy of a much more accurate definition. As applied to this shape, it’s another parameter that you can set, which moves the text up or down, in relation to the baseline.

Here we can see that negative values push the text up above the baseline, while positive numbers push it down. 0% is the default setting. Since you can change the radii of the inner and outer circles, the baseline setting isn’t super-important:

baselines

Horizontal Spacing

Sometimes you want your text to fill up a larger amount of space than the number of characters naturally wants to do. The Horizontal Spacing setting allows you to stretch out the space between characters, without resorting to cheap tricks like adding spaces between characters:

horizontal-spacing

Adding spaces between characters is a bad idea for a couple of reasons. First, it uses up valuable characters in a shape that only handles a limited amount of text. Second, the width of a space probably changes between characters due to kerning, although I don’t really know how much kerning Visio actually does with its text.

Background

You can choose to have no circles, a single circle, or a ring as a background for your circular text. Just set the Background setting in the Shape Data panel:

backgrounds

Context Menu

Almost all of the settings in the Shape Data panel are available by right-clicking the shape, plus a few extra items. Baseline is missing, Text Orientation only has two values to choose from, and Horizontal Alignment only has four.

Keep in mind that when you right-click a shape, only the primary selection (first selected shape) will be affected when you choose the custom actions at the top of the menu. If you need to change multiple shapes at once, use the Shape Data panel.

context-menu

You’ll notice a few items in the menu that aren’t in the Shape Data panel. Let’s go over those:

Refresh

The purchasable shapes come in 25-, 50- and 100-character versions. For some reason, on the higher-character version, changing certain settings can cause the text to get out-of-whack. I’ve worked and worked on this problem, but I was not able to keep it from happening. I think the chains of cell references inside the ShapeSheet for this beast-of-a-shape are quite long, and at some point, Visio gets overloaded.

I was, however, able to come up with a workaround. Just right-click and choose “Refresh”. This forces the shape to do a lot of recalculation, and your characters should magically jump into their proper positions.

In this example, a change to the Text Orientation causes the characters to get jumbled near the end of the phrase:

refresh

Right-clicking Refresh clears it right up in a jiffy!

I know it seems a bit 1990’s, but I just couldn’t find any other solution. Remember, we are pushing Visio into areas where it wasn’t originally conceived to go!

Live Dynamics

Visio shapes support “live dynamics”, which lets you see how the shape will react as you resize it, and as you move control handles. Since this shape has a large amount of ShapeSheet references, it can get pretty slow, especially in the versions that have more than 25 characters.

For this reason, Live Dynamics is off by default. And if you are doing lots of resizing, you should leave it off. But once you’ve got the shape to the size you want it, live dynamics performs just fine when you are rotating the text around the circle with the control handle. Even for large numbers of characters. So try turning it on, it’s pretty fluid, and cool to watch!

Show Warning Text

For performance and economic reasons, there are different versions of the shape, that support different numbers of characters. If you exceed this number, a red warning appears. Here we have a “25-banger” shape that has run out of space and only shows the “ch” in “characters”:

 

overflow-warning

If you plan on shortening the text later, you might want to suppress the warning. Just right-click the shape and uncheck “Show Warning Text”. If, in the future, you reduce the text to below the maximum characters, and then exceed it again, the warning will reappear, so you don’t have to worry about it being permanently asleep.

Angle Presets

Sometimes it is hard to position a control handle exactly as you want it. For this reason, there are four presets available for quickly snapping your text clock-hand to the 12, 3, 6 and 9 O’Clock positions.

Open Group Window…

When editing the shape normally, you can’t give individual characters or runs of characters different styling. This is because the text you normally edit is actually mirrored by subshapes within the group.

Once you’ve set your text, you can can go into the group and style individual characters. Just right-click, select Open Group Window, then manipuplate individual character subshapes.

In fact, I did just that when making the presidential seal graphic that serves as the thumbnail for this article.  The “OF THE” bits needed to have a smaller font size, so I went inside the group, selected the shapes, then reduced their font size:

group-windowIf you edit the outer text later, keep in mind that you might end up with the wrong formatting for the wrong characters within your new text.

The almost-finished presidential seal:

text-on-a-circle-shape

The shape contains two text-on-a-circle shapes. The main text, and the white-on-blue that has a bunch of asterisks. Getting the spacing on the asterisks just right involved tweaking the font size, then tweaking the Horizontal Spacing setting. Since these are the 100-character versions, changing the settings took a few seconds to complete. It’s a busy shape! You can also see a small gap at the bottom of the stars. The shape has no automatic way to distribute characters evenly around the entire shape. Maybe in the next version!

Get the Text on a Circle Visio Shape

Free Version

The free version has all of the features described above, but only supports four characters of text. Get a feel for how the shape works, then buy the full version:

Text on a Circle FREE (21.62 kB) - 541

Full Version

Buy the full product: Text on a Circle Visio SmartShape on Gumroad

 

18 Comments »

  • […] 2014.05.12: be sure to check out the latest incarnation of text on a circle in: Text on a Circle Visio Shape. A self-contained shape that works without VBA macro […]

  • […] 2014.05.12: be sure to check out the latest incarnation of text on a circle in: Text on a Circle Visio Shape. A self-contained shape that works without VBA macro […]

  • sjellison says:

    Thanks for creating this shape, I’m trying to use and it says it’s limited to 4 characters, is there anything I can do to change that?

  • Visio Guy says:

    Hi SJ,

    As is states in the article, the free version supports only 4 characters, so you can get a feel for how it works, and decide if you want to purchase the expanded version.

    The free version also allows folks with Visio developer skills and lots of time to tear it apart and see how it works.

    The not-free version comes in 25, 50 or 100-character-max versions. You can get it here: Text on Circle SmartShape.

  • urmyfaith says:

    3Q,It really works. Give me a lot of fun.

  • akost says:

    Having trouble modifying font properties. Is Text on a Circle Visio Shape compatible with Visio 2013?

  • Visio Guy says:

    Hi AK,

    If the characters get jumbled, right-click and choose Refresh.

    Yes, I tested it with Visio 2013. It worked fine.

    What are you trying to modify?

    (Note: I’m on vacation Aug. 14-25, with limited to no internet)

  • Mohammed Hussain says:

    Hi

    Im looking for a family tree chart Stencil,also im looking for a visio stencil writers. Can you please advise me

  • Iain Murray says:

    I want to buy your software, but I won’t use Gumroad, see https://www.youtube.com/watch?v=CQpaLL2MPw8 for reasons.

  • Visio Guy says:

    Hi Iain,

    Thanks for your concern, and watching out for us!

    What I can offer is this:

    1. That video is over one year old.
    2. I don’t use the pop-up purchase frame.
    3. Every avenue for purchasing my stuff that goes through Gumroad is displaying the security padlock icon in the web browser’s address.

    So as far as I can tell, there might have been concerns, but has been remedied in the past year by Gumroad.

  • nsx9red says:

    Is there a way to resize the text?

  • Visio Guy says:

    Hi nsx9red,

    Yes, you can resize the font using the standard Visio font-size controls.

  • jc22 says:

    I can’t download the free one..

  • Roy says:

    Text on a Circle (ver 3) is working great for me. Only problem I have run across is using the Wingding font. I am trying to add stars to my text (Wingding 171) but it always translates to >>. Can you tell me if I am doing something wrong? Thanks.

  • Visio Guy says:

    Hi Roy,

    Great question!

    The text that you edit is a bit different than the actual text that is arranged around the circle. The text on the circle doesn’t really know what font you’ve typed the characters in. That’s why you’re getting the
    «« characters.

    Here’s the trick:

    1. Right-click the Text on Circle shape and choose Open Group Window…
    2. Select the shapes that *should* be stars.
    3. Change the font of just those subshapes to Wingdings.
    4. Close the group-editing window to return to the main drawing page window.

    Alternatively, you can select the whole Text on Circle shape and change the font to Wingdings, after you have inserted stars and typed your text. Now all of the letters will be gobbledygook.

    Then, go into the group as described above, select all of the shapes that aren’t stars, and change their font settings back to something that shows normal text characters.

    Hopefully this makes sense and helps!

  • Roy says:

    Thank you! Worked perfectly and would not have figured that out on my own. :)

  • Rasha Badawi says:

    I can not write text more than 4 characters long, help!

  • Visio Guy says:

    Hi Rasha,

    The free download only offers four characters by design. The for-purchase version can be obtained here: Text on a Circle Visio SmartShape.

    This non-free version offers circles that can support up to 25, 50 or 100 characters.

    Cheers,

    Chris

Leave a comment!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.

*