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.

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

Suggestion: embed local data when exporting (if possible) #153

Open
manzt opened this issue May 15, 2024 · 0 comments
Open

Suggestion: embed local data when exporting (if possible) #153

manzt opened this issue May 15, 2024 · 0 comments

Comments

@manzt
Copy link
Member

manzt commented May 15, 2024

For simple text-based datasets (e.g., tsv/csv), it would be nice to just embed the data in the final HTML to avoid needing a server. We could add an extra option to render html (e.g., embed_data) to embed data in the HTML and include a data URL.

gos/gosling/display.py

Lines 13 to 77 in 2bef69b

HTML_TEMPLATE = jinja2.Template(
"""
<!DOCTYPE html>
<html>
<head>
<style>.error { color: red; }</style>
</head>
<body>
<div id="{{ output_div }}"></div>
<script type="module">
import { importWithMap } from "https://unpkg.com/[email protected]";
let importMap = {{ import_map }};
let gosling = await importWithMap("gosling.js", importMap);
let el = document.getElementById('{{ output_div }}');
let spec = {{ spec }};
let opt = {{ embed_options }};
gosling.embed(el, spec, opt).catch((err) => {
el.innerHTML = `\
<div class="error">
<p>JavaScript Error: ${error.message}</p>
<p>This usually means there's a typo in your Gosling specification. See the javascript console for the full traceback.</p>
</div>`;
throw error;
});
</script>
</body>
</html>
"""
)
GoslingSpec = Dict[str, Any]
def get_gosling_import_map(
gosling_version: str = SCHEMA_VERSION.lstrip("v"),
higlass_version: str = "1.13",
react_version: str = "18",
pixijs_version: str = "6",
) -> dict:
return {
"imports": {
"react": f"https://esm.sh/react@{react_version}",
"react-dom": f"https://esm.sh/react-dom@{react_version}",
"pixi": f"https://esm.sh/pixi.js@{pixijs_version}",
"higlass": f"https://esm.sh/higlass@{higlass_version}?external=react,react-dom,pixi",
"gosling.js": f"https://esm.sh/gosling.js@{gosling_version}?external=react,react-dom,pixi,higlass",
}
}
def spec_to_html(
spec: GoslingSpec,
output_div: str = "vis",
embed_options: Dict[str, Any] | None = None,
**kwargs,
):
embed_options = embed_options or dict(padding=0, theme=themes.get())
deps = get_gosling_import_map(**kwargs)
return HTML_TEMPLATE.render(
spec=json.dumps(spec),
embed_options=json.dumps(embed_options),
output_div=output_div,
import_map=json.dumps(deps),
)

cc: @maxgmarin

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant