question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

the href encoding

See original GitHub issue

Hi Jake and all,

Is the href encoding supported in Altair? I can’t tell by the docs how I would use it. Vega lite docs uses “as” in the spec and of course that is a key work in Python:

{
  "data": {"url": "data/cars.json"},
  "mark": "point",
  "transform": [{
    "calculate": "'https://www.google.com/search?q=' + datum.Name", "as": "url"
  }],
  "encoding": {
    "x": {"field": "Horsepower", "type": "quantitative"},
    "y": {"field": "Miles_per_Gallon", "type": "quantitative"},
    "color": {"field": "Origin", "type": "nominal"},
    "tooltip": {"field": "Name", "type": "nominal"},
    "href": {"field": "url", "type": "nominal"}
  }
}

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:17 (9 by maintainers)

github_iconTop GitHub Comments

2reactions
jakevdpcommented, Aug 13, 2018

Yes, it is supported. For example, here we modify a scatter plot of car properties so that clicking on any point opens a google search for the car name:

import altair as alt
from vega_datasets import data

try:
    # Python 3
    from urllib.parse import urlencode
except ImportError:
    # Python 2
    from urllib import urlencode

def make_google_query(name):
    return "https://www.google.com/search?" + urlencode({'q': '"{0}"'.format(name)})

cars['url'] = cars['Name'].apply(make_google_query)

alt.Chart(cars).mark_circle(size=60).encode(
    x='Horsepower',
    y='Miles_per_Gallon',
    color='Origin',
    href='url',
    tooltip=['Name', 'url']
)

This would probably be worth adding as an example in the docs

0reactions
dchudzcommented, Feb 19, 2022

Ah, I see if I set the masked rows to an empty string, it’s effectively what I want (the hyperlink seems active in the browser, but it’s a non-op when you click it.)

In case this helps anyone else:

I didn’t feel that was good enough for my use case – I really want there to be no active hyperlink when there is no href.

In my case it seems to work well to make two charts, and add them to together:

        with_urls = (altair.Chart(df[df.Url.notnull()])
        .encode(
            href="Url",
...
        ))

        without_urls = (altair.Chart(df[df.Url.isnull()])
        .encode(
            x="Date:O",
            y=altair.Y("test:N", title=None),
...   # no href
        ))

with_urls + without_urls
Read more comments on GitHub >

github_iconTop Results From Across the Web

HTML URL Encoding Reference - W3Schools
Character From Windows‑1252 From UTF‑8 space %20 %20 ! %21 %21 " %22 %22
Read more >
how to encode href attribute in HTML - Stack Overflow
Construct a URL as normal. Follow the rules for constructing URLs. Encode data you put into it. Then construct HTML as normal.
Read more >
How to Perform URL Encoding in HTML? (Example) - eduCBA
How to Perform URL Encoding in HTML? · HTML language creates URL using <a> tag and href attribute. · Some characters are restricted...
Read more >
HTML - URL Encoding - Tutorialspoint
Decimal Hex Value Character URL Encode 128 80 € %80 129 81 %81 130 82 ‚ %82
Read more >
HTML URL-encoding Reference - ESO.org
HTML URL-encoding Reference. Below is a reference of ASCII characters in URL-encoding form (hexadecimal format). Hexadecimal values can be used to display ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found