Is there a way to outline text?

31

10

If I have:

Graphics[
  {Red, EdgeForm[Directive[White, Thick]], 
  Inset[Style[Text@"Hi!", 44], {0, 0}]}, Background -> Black
]  

I unfortunately get:
hi
Which as you can see does not have a thick white outline. Is there a way to get around this since EdgeForm clearly does not work?

By the way, I would rather NOT delve into making a larger, white "Hi" and then putting the red one on top. That's just not elegant.

MMA 8.0.1 for students
OS Windows 7 64-bit

VF1

Posted 2012-07-13T19:56:00.423

Reputation: 4 472

there was a question on Stack Overflow strongly related to this one. – Dr. belisarius – 2012-07-13T20:02:05.453

2Oh, I did not know. I sort of gave up googling for MMA help since there usually isn't anything except for stuff here. Also, I can't find it. – VF1 – 2012-07-13T20:04:31.787

Answers

31

Import text as a FilledCurve in graphics, using PDF as an intermediate format. Below are modified examples from Documentation Center:

text = First[First[ImportString[ExportString[Style["Hi", Italic, FontSize -> 24, 
FontFamily -> "Times"], "PDF"], "PDF", "TextMode" -> "Outlines"]]];

Outline fonts using different edge and face forms:

Graphics[{EdgeForm[Directive[White, Thick]], Red, text},
Background -> Black, PlotRange -> {{-5, 25}, {-0, 20}}]

enter image description here

3D text effect:

Graphics[{EdgeForm[Opacity[0.5]], Table[{ColorData["TemperatureMap"][t], 
    Translate[text, 4 {-t, t}]}, {t, 0, 1, 1/10}]}, ImageSize -> Medium]

enter image description here

Vitaliy Kaurov

Posted 2012-07-13T19:56:00.423

Reputation: 66 672

Vitaliy, very nice! – alancalvitti – 2012-07-13T20:36:19.937

3Cool. But is this really the only way? It's a bit slow to convert it to a curve and I need to display the graphics quickly in my game. The text changes based on the game's statistics, so precomputing's not an option... – VF1 – 2012-07-13T20:55:54.460

1@vlad you can do the curve conversion on a letter basis in advance. You'd need a kerning table as well, but that shouldn't be too difficult to generate. – Sjoerd C. de Vries – 2012-07-13T21:57:55.910

@vlad, the idea by SjoerdC.deVries is indeed a good solution. Otherwise you're risking to end up "delving into making a larger, white "Hi" and then putting the red one on top" ;-) – Vitaliy Kaurov – 2012-07-13T22:02:36.633

Interestingly, the option "TextMode" -> "Outlines" can be omitted, as I observed in this answer which also shows another use for outlined characters

– Jens – 2012-07-13T22:33:27.277

5While clever it strikes me as really quite atrocious to have to do an Export->Import to get the outlines. I keep hoping someone will find or share an internal function that does this. :-/ – Mr.Wizard – 2012-07-14T01:10:38.947

Congrats on 10k! :) – rm -rf – 2012-07-18T18:33:02.270

@R.M Thanks! Nice of you to let me know ;-) – Vitaliy Kaurov – 2012-07-18T18:56:37.767

13

An important issue in the question seems to be that of speed. So as Sjoerd suggested, I wrote a solution that pre-outlines all the characters in a reasonable range of ASCII characters, and then does the replacements on an arbitrary string. The characters are stored in a table ascii, and their graphic replacements in asciiGraphics. I then define the replacement rule (rule) which is part of the function makeText:

ascii = CharacterRange[" ", "z"]

(*
==> {" ", "!", "\"", "#", "$", "%", "&", "'", "(", ")", "*", \
"+", ",", "-", ".", "/", "0", "1", "2", "3", "4", "5", "6", "7", "8", \
"9", ":", ";", "<", "=", ">", "?", "@", "A", "B", "C", "D", "E", "F", \
"G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", \
"U", "V", "W", "X", "Y", "Z", "[", "\\", "]", "^", "_", "`", "a", \
"b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", \
"p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"}
*)


asciiGraphics = 
  First@ImportString[
      ExportString[Style[#, FontFamily -> "Times", FontSize -> 44], 
       "PDF"], "TextOutlines" -> True] & /@ ascii;

rule = Dispatch[Thread[ascii -> asciiGraphics]];


Clear[makeText];
Options[makeText] = {"OutlineThickness" -> 1, "OutlineColor" -> White,
   "Color" -> Red}; 
makeText[string_, OptionsPattern[]] := 
 DisplayForm[
  Row[Characters[string] /. rule] /. 
   FilledCurve[
     x__] :> {EdgeForm[{AbsoluteThickness[
        OptionValue["OutlineThickness"]], 
       OptionValue["OutlineColor"]}],
     OptionValue["Color"],
     FilledCurve[x]
     }
  ]

The argument to makeText is the string to be rendered as outlined text. The thickness of the outlines is specified by the option "OutlineThickness". The other two options are "OutlineColor" and "Color" (of the filled areas).

The following is a demo - you win the game by sliding the slider to the right...

Manipulate[
 Style[Pane[
   makeText["Player 1 has " <> ToString[Floor[p]] <> " points", 
    "OutlineThickness" -> .7], ImageSize -> 360], 
   Background -> Black,
   Magnification -> 3
 ], {p, 0, 1000}]

manipulate

Edit

In response to the question in the comment:

By using Dispatch you can eke out a faster timing, and my focus was on getting fast execution. It won't matter much if you're dealing only with a short string. But if you're trying to translate a long text into outlined characters, the replacement is sped up when you first apply Dispatch to the rule.

Jens

Posted 2012-07-13T19:56:00.423

Reputation: 93 191

Intresting. But what is the role of Dispatch? – VF1 – 2012-07-14T02:44:03.683

1By using Dispatch you can eke out a faster timing, and my focus was on getting fast execution. It won't matter much if you're dealing only with a short string. But if you're trying to translate a long text into outlined characters, the replacement is sped up when you first apply Dispatch to the rule. – Jens – 2012-07-14T04:08:08.827

@Vlad Speed is the biggest hurdle when doing anything interactive in Mathematica - I hope you'll be able to overcome that for your game... – Jens – 2012-07-14T04:09:59.980

9

In version 10, we can bypass exporting to PDF and re-importing and can outline text directly using region discretization functions. This is shown in the documentation of BoundaryDiscretizeGraphics.

reg = BoundaryDiscretizeGraphics[Text[Style["R", FontFamily -> "Cambria"]], _Text]

Mathematica graphics

The region can then be converted back to graphics, and the FilledCurve extracted.

WARNING: I just realized that the following line will often crash the kernel with 10.1.0 on OS X! Proceed with caution!

Cases[Normal@Show[reg], _FilledCurve, Infinity]

Normal is for getting rid of GraphicsComplex inside the resulting Graphics object.

If there is a direct way to go from a BoundaryMeshRegion to a FilledCurve, without having to use Show, please let me know!

Szabolcs

Posted 2012-07-13T19:56:00.423

Reputation: 213 047

weird, RegionBoundary[reg]//FullForm shows the polygon data, but there is no evident way to programmatically extract it. Apply doesn't work.. on a MeshRegion – george2079 – 2015-07-16T19:31:28.693

I'm amazing you can discretize a word,and how do you find the pattern of "_Text"??Do you help me discretize a Tube?Such as "Graphics3D[Tube[{{0, 0, 0}, {1, 1, 1}}, .1]]"? – yode – 2015-09-25T18:35:44.687

@yode It's in the documentation I linked to, almost this very example. I really don't know more than what's there. – Szabolcs – 2015-09-25T20:45:51.237

If you provide character i, it would generate Polygon instead of FilledCurve. – kh40tika – 2016-12-20T11:07:46.283

@user1950580 I've done this now where I search for either of them. It suffices to get all the cases I've tried. – b3m2a1 – 2017-03-17T05:11:34.253