Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Enhancement of Vega-Embed CSS for Improved Display and Flexibility #2867

Merged
merged 9 commits into from
Apr 26, 2023
Merged

Enhancement of Vega-Embed CSS for Improved Display and Flexibility #2867

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
798d312
Update html.py
nlafleur Feb 3, 2023
741ca91
Merge branch 'master' into patch-3
mattijn Feb 3, 2023
4078004
Merge branch 'master' into patch-3
mattijn Apr 25, 2023
567f742
include output_div tag and inline_html_template
mattijn Apr 25, 2023
9a1b895
include note in changes.rst
mattijn Apr 25, 2023
ab6319e
include style within universal template
mattijn Apr 25, 2023
d3428c7
remove trailing whitespace
mattijn Apr 25, 2023
e78bdac
update changes.rst
mattijn Apr 25, 2023
76607e1
Update doc/releases/changes.rst
mattijn Apr 26, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 31 additions & 3 deletions altair/utils/html.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,14 @@
<head>
{%- endif %}
<style>
.error {
color: red;
#{{ output_div }}.vega-embed {
width: 100%;
display: flex;
}

#{{ output_div }}.vega-embed details,
#{{ output_div }}.vega-embed details summary {
position: relative;
}
</style>
{%- if not requirejs %}
Expand Down Expand Up @@ -60,7 +66,7 @@
var embedOpt = {{ embed_options }};

function showError(el, error){
el.innerHTML = ('<div class="error" style="color:red;">'
el.innerHTML = ('<div style="color:red;">'
+ '<p>JavaScript Error: ' + error.message + '</p>'
+ "<p>This usually means there's a typo in your chart specification. "
+ "See the javascript console for the full traceback.</p>"
Expand All @@ -83,6 +89,17 @@

HTML_TEMPLATE_UNIVERSAL = jinja2.Template(
"""
<style>
#{{ output_div }}.vega-embed {
width: 100%;
display: flex;
}

#{{ output_div }}.vega-embed details,
#{{ output_div }}.vega-embed details summary {
position: relative;
}
</style>
<div id="{{ output_div }}"></div>
<script type="text/javascript">
var VEGA_DEBUG = (typeof VEGA_DEBUG == "undefined") ? {} : VEGA_DEBUG;
Expand Down Expand Up @@ -151,6 +168,17 @@
<!DOCTYPE html>
<html>
<head>
<style>
#{{ output_div }}.vega-embed {
width: 100%;
display: flex;
}

#{{ output_div }}.vega-embed details,
#{{ output_div }}.vega-embed details summary {
position: relative;
}
</style>
<script type="text/javascript">
// vega.js v{{ vega_version }}
{{ vega_script }}
Expand Down
1 change: 1 addition & 0 deletions doc/releases/changes.rst
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ Enhancements
- Substantially improved error handling. Both in terms of finding the more relevant error (#2842), and in terms of improving the formatting and clarity of the error messages (#2824, #2568, #2979, #3009).
- Include experimental support for the DataFrame Interchange Protocol (through ``__dataframe__`` attribute). This requires ``pyarrow>=11.0.0`` (#2888).
- Support data type inference for columns with special characters (#2905).
- Responsive width support using ``width="container"`` when saving charts to html or displaying them with the default `html` renderer (#2867).

Grammar Changes
~~~~~~~~~~~~~~~
Expand Down