Plot tick labels as URLs

On Sunday, August 7, 2016 at 5:07:56 PM UTC-7, Ron Cordell wrote:

Hi,

I’ve got a bokeh 0.12.1 HTML output “page” that has come a long way since I first started learning how to work with Bokeh! I’m working on some final nice things to have, and one of those is the ability to make the labels on a graph URLs that the user can click. These would be categorical labels, of course.

I’ve tried using the FuncTickFormatter to create a custom object that has my labels in it and maps the tick number to the label string. However, if I put a string like “MyLabel” as the string for the label, it is literally rendered and not treated as an HTML element.

I saw an example where the TickFormatter class was extended for customer functionality, but this appeared to work only for the bokeh_server.

Is there a way to make the tick labels render as HTML anchor tags?

Thanks!

On Mon, Aug 8, 2016 at 2:07 AM, Ron Cordell ron.cordell@gmail.com wrote:

Hi,

I’ve got a bokeh 0.12.1 HTML output “page” that has come a long way since I first started learning how to work with Bokeh! I’m working on some final nice things to have, and one of those is the ability to make the labels on a graph URLs that the user can click. These would be categorical labels, of course.

I’ve tried using the FuncTickFormatter to create a custom object that has my labels in it and maps the tick number to the label string. However, if I put a string like “MyLabel” as the string for the label, it is literally rendered and not treated as an HTML element.

I saw an example where the TickFormatter class was extended for customer functionality, but this appeared to work only for the bokeh_server.

Is there a way to make the tick labels render as HTML anchor tags?

currently it’s impossible to achieve this, because tick labels are rendered directly to HTML canvas element, so only plain text is allowed. Unfortunately I don’t have any advice right now how to get around this. For a while now we where supposed to implement clickable tick labels, in which case you could configure a callback which would redirect to an external page. This didn’t happen yet. Maybe others will have more helpful insight.

Mateusz

Thanks!

–

You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.

To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.

To post to this group, send email to bokeh@continuum.io.

To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/10ce7e76-5057-4d77-9907-bbbdda7b245f%40continuum.io.

For more options, visit https://groups.google.com/a/continuum.io/d/optout.

On Aug 8, 2016, at 9:43 AM, Mateusz Paprocki <mateusz.paprocki@continuum.io> wrote:

Hi,

On Mon, Aug 8, 2016 at 2:07 AM, Ron Cordell <ron.cordell@gmail.com> wrote:
Hi,

I've got a bokeh 0.12.1 HTML output "page" that has come a long way since I first started learning how to work with Bokeh! I'm working on some final nice things to have, and one of those is the ability to make the labels on a graph URLs that the user can click. These would be categorical labels, of course.

I've tried using the FuncTickFormatter to create a custom object that has my labels in it and maps the tick number to the label string. However, if I put a string like "<a href='www.nytimes.com'>MyLabel</a>" as the string for the label, it is literally rendered and not treated as an HTML element.

I saw an example where the TickFormatter class was extended for customer functionality, but this appeared to work only for the bokeh_server.

Is there a way to make the tick labels render as HTML anchor tags?

currently it's impossible to achieve this, because tick labels are rendered directly to HTML canvas element, so only plain text is allowed. Unfortunately I don't have any advice right now how to get around this. For a while now we where supposed to implement clickable tick labels, in which case you could configure a callback which would redirect to an external page. This didn't happen yet. Maybe others will have more helpful insight.

Mateusz

Thanks!

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.
To post to this group, send email to bokeh@continuum.io.
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/10ce7e76-5057-4d77-9907-bbbdda7b245f%40continuum.io\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.
To post to this group, send email to bokeh@continuum.io.
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/CANFzp8i4FNtAJuikTc6%2B9KB6TLVN9SKCsfa3UMZBC%3DnVSMg4Xw%40mail.gmail.com\.
For more options, visit https://groups.google.com/a/continuum.io/d/optout\.

On 8/8/16 9:42 AM, Bryan Van de Ven
wrote:

There is now a proper Label class, and it might not be such a hard thing to make a clickable custom extension subclass. But axes don't currently use Label internally, so that would not really help if the requirement is really for axis tick labels. I think the only avenue would be to make a custom axis subclass, that also plugs into the event system, and does its own hit testing against the internal label locations. But axis is currently one of the largest and most complicated models on the BokehJS side, so I don't think this is a trivial task.
If you have JS experience and want an interesting project to dive into, we can certainly help answer questions and provide guidance. Otherwise, I can only suggest opening a feature request issue on GitHub. However the main priority for the next several months is to get to a 1.0 release so I could not make any comments about when it might possibly get looked at. Thanks,
Bryan

On Aug 8, 2016, at 9:43 AM, Mateusz Paprocki wrote:
Hi,
On Mon, Aug 8, 2016 at 2:07 AM, Ron Cordell wrote:
Hi,
I've got a bokeh 0.12.1 HTML output "page" that has come a long way since I first started learning how to work with Bokeh! I'm working on some final nice things to have, and one of those is the ability to make the labels on a graph URLs that the user can click. These would be categorical labels, of course.
I've tried using the FuncTickFormatter to create a custom object that has my labels in it and maps the tick number to the label string. However, if I put a string like "<a href=''>MyLabel</a>" as the string for the label, it is literally rendered and not treated as an HTML element.
I saw an example where the TickFormatter class was extended for customer functionality, but this appeared to work only for the bokeh_server.
Is there a way to make the tick labels render as HTML anchor tags?
currently it's impossible to achieve this, because tick labels are rendered directly to HTML canvas element, so only plain text is allowed. Unfortunately I don't have any advice right now how to get around this. For a while now we where supposed to implement clickable tick labels, in which case you could configure a callback which would redirect to an external page. This didn't happen yet. Maybe others will have more helpful insight.
Mateusz
Thanks!
-- You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to .
To post to this group, send email to .
To view this discussion on the web visit .
For more options, visit .
-- You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to .
To post to this group, send email to .
To view this discussion on the web visit .
For more options, visit .

–
Sarah Bird
Developer, Bokeh

    [
      ![Continuum Analytics](http://docs.continuum.io/_static/img/ContinuumWordmark.png)
    ](http://continuum.io)

mateusz.paprocki@continuum.ioron.cordell@gmail.comwww.nytimes.combokeh+unsubscribe@continuum.iobokeh@continuum.iohttps://groups.google.com/a/continuum.io/d/msgid/bokeh/10ce7e76-5057-4d77-9907-bbbdda7b245f%40continuum.iohttps://groups.google.com/a/continuum.io/d/optoutbokeh+unsubscribe@continuum.iobokeh@continuum.iohttps://groups.google.com/a/continuum.io/d/msgid/bokeh/CANFzp8i4FNtAJuikTc6%2B9KB6TLVN9SKCsfa3UMZBC%3DnVSMg4Xw%40mail.gmail.comhttps://groups.google.com/a/continuum.io/d/optout

On Mon, Aug 8, 2016 at 10:00 AM, Sarah Bird - Continuum sbird@continuum.io wrote:

      Just a small

follow-up

" There is now a proper Label
class, and it might not be such a hard thing to make a clickable
custom extension subclass."

  I'm not sure you'd need to make an extension. If you set the

render-mode of the Label to css then you may get clickable html
out - I haven’t tried - just a thought.

  On 8/8/16 9:42 AM, Bryan Van de Ven

wrote:

There is now a proper Label class, and it might not be such a hard thing to make a clickable custom extension subclass. But axes don't currently use Label internally, so that would not really help if the requirement is really for axis tick labels. I think the only avenue would be to make a custom axis subclass, that also plugs into the event system, and does its own hit testing against the internal label locations. But axis is currently one of the largest and most complicated models on the BokehJS side, so I don't think this is a trivial task.
If you have JS experience and want an interesting project to dive into, we can certainly help answer questions and provide guidance. Otherwise, I can only suggest opening a feature request issue on GitHub. However the main priority for the next several months is to get to a 1.0 release so I could not make any comments about when it might possibly get looked at. Thanks,
Bryan

On Aug 8, 2016, at 9:43 AM, Mateusz Paprocki <mateusz.paprocki@continuum.io> wrote:
Hi,
On Mon, Aug 8, 2016 at 2:07 AM, Ron Cordell <ron.cordell@gmail.com> wrote:
Hi,
I've got a bokeh 0.12.1 HTML output "page" that has come a long way since I first started learning how to work with Bokeh! I'm working on some final nice things to have, and one of those is the ability to make the labels on a graph URLs that the user can click. These would be categorical labels, of course.
I've tried using the FuncTickFormatter to create a custom object that has my labels in it and maps the tick number to the label string. However, if I put a string like "<a href='[www.nytimes.com](http://www.nytimes.com)'>
MyLabel</a>" as the string for the label, it is literally rendered and not treated as an HTML element.
I saw an example where the TickFormatter class was extended for customer functionality, but this appeared to work only for the bokeh_server.
Is there a way to make the tick labels render as HTML anchor tags?
currently it's impossible to achieve this, because tick labels are rendered directly to HTML canvas element, so only plain text is allowed. Unfortunately I don't have any advice right now how to get around this. For a while now we where supposed to implement clickable tick labels, in which case you could configure a callback which would redirect to an external page. This didn't happen yet. Maybe others will have more helpful insight.
Mateusz
Thanks!
-- You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.
To post to this group, send email to bokeh@continuum.io.
To view this discussion on the web visit [https://groups.google.com/a/continuum.io/d/msgid/bokeh/10ce7e76-5057-4d77-9907-bbbdda7b245f%40continuum.io](https://groups.google.com/a/continuum.io/d/msgid/bokeh/10ce7e76-5057-4d77-9907-bbbdda7b245f%40continuum.io).
For more options, visit [https://groups.google.com/a/continuum.io/d/optout](https://groups.google.com/a/continuum.io/d/optout)

.
-- You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.
To post to this group, send email to bokeh@continuum.io.
To view this discussion on the web visit [https://groups.google.com/a/continuum.io/d/msgid/bokeh/CANFzp8i4FNtAJuikTc6%2B9KB6TLVN9SKCsfa3UMZBC%3DnVSMg4Xw%40mail.gmail.com](https://groups.google.com/a/continuum.io/d/msgid/bokeh/CANFzp8i4FNtAJuikTc6%2B9KB6TLVN9SKCsfa3UMZBC%3DnVSMg4Xw%40mail.gmail.com).
For more options, visit [https://groups.google.com/a/continuum.io/d/optout](https://groups.google.com/a/continuum.io/d/optout).

–
Sarah Bird
Developer, Bokeh

    [
      ![Continuum Analytics](http://docs.continuum.io/_static/img/ContinuumWordmark.png)
    ](http://continuum.io)

–

You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.

To unsubscribe from this group and stop receiving emails from it, send an email to bokeh+unsubscribe@continuum.io.

To post to this group, send email to bokeh@continuum.io.

To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/18c29fc3-d36f-8972-d3cb-0a779c1583ef%40continuum.io.

For more options, visit https://groups.google.com/a/continuum.io/d/optout.

On 8/8/16 9:43 PM, Ron Cordell wrote:

I tried as Sarah suggested, something like this:

_label = Label(x=70, y=70, x_units='screen', y_units='screen', text='<a href="">This is a test</a>',
               render_mode='css', border_line_color='black', border_line_alpha=1.0, level='tool'
)
fig.add_layout(_label)

      And it does render "This is a test" as a label with and

underline as opposed to the This is a test that using
the FuncTickFormatter yields.

This is what we get, which should work!

This is a test

``

      Except that the link isn't actually clickable - the cursor

remains as a + and attempts to click the link don’t do
anything.

Thanks again for the ideas!

–

  You received this message because you are subscribed to the Google

Groups “Bokeh Discussion - Public” group.

  To unsubscribe from this group and stop receiving emails from it,

send an email to bokeh+unsubscribe@continuum.io.

  To post to this group, send email to bokeh@continuum.io.

  To view this discussion on the web visit [https://groups.google.com/a/continuum.io/d/msgid/bokeh/29ab027c-0f72-4368-a5ef-171e41bd5c20%40continuum.io](https://groups.google.com/a/continuum.io/d/msgid/bokeh/29ab027c-0f72-4368-a5ef-171e41bd5c20%40continuum.io?utm_medium=email&utm_source=footer).

  For more options, visit [https://groups.google.com/a/continuum.io/d/optout](https://groups.google.com/a/continuum.io/d/optout).

–
Sarah Bird
Developer, Bokeh

    [
      ![Continuum Analytics](http://docs.continuum.io/_static/img/ContinuumWordmark.png)
    ](http://continuum.io)

www.nytimes.comwww.nytimes.comwww.nytimes.com

On Tuesday, August 9, 2016 at 10:50:27 AM UTC-7, Sarah Bird wrote:

      What happens if you

set level=‘overlay’?

On 8/8/16 9:43 PM, Ron Cordell wrote:

I tried as Sarah suggested, something like this:

_label = Label(x=70, y=70, x_units='screen', y_units='screen', text='<a href="[www.nytimes.com](http://www.nytimes.com)">This is a test</a>',
               render_mode='css', border_line_color='black', border_line_alpha=1.0, level='tool'
)
fig.add_layout(_label)

      And it does render "This is a test" as a label with and

underline as opposed to the This is a test that using
the FuncTickFormatter yields.

This is what we get, which should work!

This is a test

``

      Except that the link isn't actually clickable - the cursor

remains as a + and attempts to click the link don’t do
anything.

Thanks again for the ideas!

–

  You received this message because you are subscribed to the Google

Groups “Bokeh Discussion - Public” group.

  To unsubscribe from this group and stop receiving emails from it,

send an email to bokeh+un...@continuum.io.

  To post to this group, send email to bo...@continuum.io.

  To view this discussion on the web visit [https://groups.google.com/a/continuum.io/d/msgid/bokeh/29ab027c-0f72-4368-a5ef-171e41bd5c20%40continuum.io](https://groups.google.com/a/continuum.io/d/msgid/bokeh/29ab027c-0f72-4368-a5ef-171e41bd5c20%40continuum.io?utm_medium=email&utm_source=footer).

  For more options, visit [https://groups.google.com/a/continuum.io/d/optout](https://groups.google.com/a/continuum.io/d/optout).

–
Sarah Bird
Developer, Bokeh

    [
      <img alt="Continuum Analytics" src="https://lh6.googleusercontent.com/proxy/VYgVjggTk1hCXSN9wFkffE3I6kxTvJ51tT4KvDXOuKbs1WyFG66k7kt2-vkDimbyxfWtP-d1paJmstMYhPPnDYSUF4rLPoYM2GM2QFM=w5000-h5000" style="width:150px;min-height:30px" height="30px" width="150px">
    ](http://continuum.io)