Merge pull request #5460 from astraw38/hovertool-safe-tags

Hovertool safe tags

bokeh/models/tools.py

@@ -640,6 +640,8 @@ class HoverTool(Inspection):
             ("fill color", "$color[hex, swatch]:fill_color"),
             ("foo", "@foo"),
             ("bar", "@bar"),
+            ("baz", "@baz{safe}"),
+            ("total", "@total{$0,0.00}"
         ]
 
     You can also supply a ``Callback`` to the HoverTool, to build custom
@@ -715,6 +717,17 @@ class HoverTool(Inspection):
         are: 'hex' (to display the color as a hex value), and
         'swatch' to also display a small color swatch.
 
+    Additional format options ``safe`` and `Numbro format codes <http://numbrojs.com/format.html>`_
+    can be included in a post-fix brace block on field names. ::
+
+        [("total", "@total{$0,0.00}"),
+         ("data", "@data{safe}")]
+
+    Including ``{safe}`` after a field name will override automatic escaping
+    of the tooltip data source. Any HTML tags in the data tags will be rendered
+    as HTML in the resulting HoverTool output. See :ref:`custom_hover_tooltip` for a
+    more detailed example.
+
     ``None`` is also a valid value for tooltips. This turns off the
     rendering of tooltips. This is mostly useful when supplying other
     actions on hover via the callback property.

bokehjs/src/coffee/core/util/templating.coffee

@@ -16,7 +16,7 @@ _format_number = (number) ->
   else
     return "#{number}" # get strings for categorical types
 
-export replace_placeholders = (string, data_source, i, special_vars={}) ->
+export replace_placeholders = (string, data_source, i, special_vars = {}) ->
   string = string.replace /(^|[^\$])\$(\w+)/g, (match, prefix, name) => "#{prefix}@$#{name}"
 
   string = string.replace /(^|[^@])@(?:(\$?\w+)|{([^{}]+)})(?:{([^{}]+)})?/g, (match, prefix, name, long_name, format) =>
@@ -28,13 +28,16 @@ export replace_placeholders = (string, data_source, i, special_vars={}) ->
       else
         data_source.get_column(name)?[i]
 
-    replacement =
-      if not value? then "???"
+    replacement = null
+    if not value?
+      replacement = "???"
+    else
+      if format == 'safe'
+        return '#{prefix}#{value}'
+      else if format?
+        replacement = Numbro.format(value, format)
       else
-        if format?
-          Numbro.format(value, format)
-        else
-          _format_number(value)
-    "#{prefix}#{_.escape(replacement)}"
+        replacement = _format_number(value)
+    replacement = "#{prefix}#{_.escape(replacement)}"
 
   return string

sphinx/source/docs/user_guide/examples/tools_hover_custom_tooltip.py

@@ -14,7 +14,13 @@
                 'http://bokeh.pydata.org/static/snake3D.png',
                 'http://bokeh.pydata.org/static/snake4_TheRevenge.png',
                 'http://bokeh.pydata.org/static/snakebite.jpg'
-            ]
+            ],
+            fonts=['<i>italics</i>',
+                   '<pre>pre</pre>',
+                   '<b>bold</b>',
+                   '<small>small</small>',
+                   '<del>del</del>'
+                   ]
         )
     )
 
@@ -32,6 +38,9 @@
                 <span style="font-size: 17px; font-weight: bold;">@desc</span>
                 <span style="font-size: 15px; color: #966;">[$index]</span>
             </div>
+            <div>
+                <span>@fonts{safe}</span>
+            </div>
             <div>
                 <span style="font-size: 15px;">Location</span>
                 <span style="font-size: 10px; color: #696;">($x, $y)</span>

sphinx/source/docs/user_guide/tools.rst

@@ -452,12 +452,16 @@ default tooltip:
 .. bokeh-plot:: docs/user_guide/examples/tools_hover_tooltips.py
     :source-position: above
 
+
+.. _custom_hover_tooltip:
+
 Custom Tooltip
 ''''''''''''''
 
 It is also possible to supply a custom tooltip template. To do this,
 pass an HTML string, with the Bokeh tooltip field name symbols wherever
-substitutions are desired. An example is shown below:
+substitutions are desired. You can use the ``{safe}`` tag after the column
+name to disable the escaping of HTML in the data source. An example is shown below:
 
 .. bokeh-plot:: docs/user_guide/examples/tools_hover_custom_tooltip.py
     :source-position: above