wehub-resource-sync
355 lines
18 KiB
HTML
355 lines
18 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
|
|
/>
|
|
<title>Perspective</title>
|
|
<meta
|
|
name="description"
|
|
content="Interactive analytics and data visualization component for large and streaming datasets."
|
|
/>
|
|
<link rel="icon" href="https://openjsf.org/favicon.ico" />
|
|
<link rel="stylesheet" href="style.css" />
|
|
</head>
|
|
<body>
|
|
<div class="page-container header-shift" id="page">
|
|
<nav class="navbar">
|
|
<div class="navbar__inner">
|
|
<a href="/" class="navbar__logo"><img alt="Perspective" src="/svg/perspective-logo-dark.svg"/></a>
|
|
<ul class="navbar__links">
|
|
<li><a href="/guide/index.html">Docs</a></li>
|
|
<li><a href="/examples.html">Examples</a></li>
|
|
<li>
|
|
<a
|
|
href="https://github.com/perspective-dev/perspective"
|
|
>GitHub</a
|
|
>
|
|
</li>
|
|
<li id="theme-toggle"></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
|
|
<main>
|
|
<header class="hero-banner">
|
|
<div class="hero-banner__buttons" id="demo-container"></div>
|
|
</header>
|
|
|
|
<section class="features">
|
|
<div class="features__container">
|
|
<hr />
|
|
<br /><br /><br />
|
|
<div>
|
|
<h2>What is Perspective?</h2>
|
|
<p>
|
|
Perspective is an <i>interactive</i> analytics
|
|
and data visualization component, which is
|
|
especially well-suited for <i>large</i> and/or
|
|
<i>streaming</i> datasets. Use it to create
|
|
user-configurable reports, dashboards, notebooks
|
|
and applications, then deploy stand-alone in the
|
|
browser, or in concert with Python and/or
|
|
<a
|
|
href="https://jupyterlab.readthedocs.io/en/stable/"
|
|
>Jupyterlab</a
|
|
>.
|
|
</p>
|
|
<br />
|
|
<h3>Features</h3>
|
|
<br />
|
|
<div class="feature-item">
|
|
<svg
|
|
class="feature-item__icon"
|
|
width="53"
|
|
height="67"
|
|
viewBox="0 0 53 67"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M11.6482 1.56063L1.6114 11.2435C1.22069 11.6204 1 12.14 1 12.6829V64C1 65.1046 1.89543 66 3 66H50C51.1046 66 52 65.1046 52 64V50.4471C52 49.6719 51.3716 49.0435 50.5963 49.0435C49.8211 49.0435 49.1927 48.415 49.1927 47.6398V39.1428C49.1927 38.3676 49.8211 37.7391 50.5963 37.7391C51.3716 37.7391 52 37.1107 52 36.3355V3C52 1.89543 51.1046 1 50 1H13.0368C12.5188 1 12.021 1.20098 11.6482 1.56063Z"
|
|
/>
|
|
<path
|
|
d="M29.2391 29H20.5652L16 43.431H24.2174L21.4783 56L37 38.7759H26.0435L29.2391 29Z"
|
|
/>
|
|
<path d="M42 8H45V19H42V8Z" />
|
|
<path d="M36 8H39V19H36V8Z" />
|
|
<path d="M31 8H34V19H31V8Z" />
|
|
<path d="M25 8H28V19H25V8Z" />
|
|
<path d="M19 8H22V19H19V8Z" />
|
|
<path d="M14 8H17V19H14V8Z" />
|
|
<path d="M8 14H11V22H8V14Z" />
|
|
</svg>
|
|
<div class="feature-item__text">
|
|
<p>
|
|
A fast, memory efficient streaming query
|
|
engine, written in C++ and compiled for
|
|
both
|
|
<a href="https://webassembly.org/"
|
|
>WebAssembly</a
|
|
>
|
|
and
|
|
<a href="https://www.python.org/"
|
|
>Python</a
|
|
>, with read/write/streaming for
|
|
<a href="https://arrow.apache.org/"
|
|
>Apache Arrow</a
|
|
>, and a high-performance columnar
|
|
expression language based on
|
|
<a
|
|
href="https://github.com/ArashPartow/exprtk"
|
|
>ExprTK</a
|
|
>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="feature-item">
|
|
<svg
|
|
class="feature-item__icon"
|
|
width="49"
|
|
height="71"
|
|
viewBox="0 0 49 71"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<path
|
|
d="M1 23.5001L24.3345 6.16554L47.669 23.5001L24.3345 40.8346L1 23.5001Z"
|
|
/>
|
|
<path
|
|
d="M9 41.5L1 47.3345L24.3345 64.669L47.669 47.3345L39.6518 41.3787"
|
|
/>
|
|
<path
|
|
d="M9 29.5001L1 35.3345L24.3345 52.6691L47.669 35.3345L39.6518 29.3788"
|
|
/>
|
|
</svg>
|
|
<div class="feature-item__text">
|
|
<p>
|
|
A framework-agnostic User Interface
|
|
packaged as a
|
|
<a
|
|
href="https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements"
|
|
>Custom Element</a
|
|
>, powered either in-browser via
|
|
WebAssembly or virtually via WebSocket
|
|
server (Python/Node).
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="feature-item">
|
|
<svg
|
|
class="feature-item__icon"
|
|
width="48"
|
|
height="59"
|
|
viewBox="0 0 48 59"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
>
|
|
<rect
|
|
x="2"
|
|
y="1"
|
|
width="45"
|
|
height="57"
|
|
rx="2"
|
|
/>
|
|
<circle
|
|
cx="10"
|
|
cy="11"
|
|
r="2"
|
|
fill="#666"
|
|
/>
|
|
<circle
|
|
cx="10"
|
|
cy="30"
|
|
r="2"
|
|
fill="#666"
|
|
/>
|
|
<circle
|
|
cx="10"
|
|
cy="49"
|
|
r="2"
|
|
fill="#666"
|
|
/>
|
|
<path d="M10 11H0" />
|
|
<path d="M39 10H17" />
|
|
<path d="M39 14H17" />
|
|
<path d="M39 18H17" />
|
|
<path d="M39 22H17" />
|
|
<path d="M39 26H17" />
|
|
<path d="M39 30H17" />
|
|
<path d="M39 34H17" />
|
|
<path d="M39 38H17" />
|
|
<path d="M39 42H17" />
|
|
<path d="M39 46H17" />
|
|
<path d="M39 50H17" />
|
|
<path d="M10 30H0" />
|
|
<path d="M10 49H0" />
|
|
</svg>
|
|
<div class="feature-item__text">
|
|
<p>
|
|
A
|
|
<a href="https://jupyter.org/"
|
|
>JupyterLab</a
|
|
>
|
|
widget and Python client library, for
|
|
interactive data analysis in a notebook,
|
|
as well as <i>scalable</i> production
|
|
<a
|
|
href="https://github.com/voila-dashboards/voila"
|
|
>Voila</a
|
|
>
|
|
applications.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<hr />
|
|
<br /><br /><br />
|
|
<div>
|
|
<h2>JavaScript</h2>
|
|
<p>
|
|
Interactive dashboards built on Perspective.js
|
|
<a
|
|
href="https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements"
|
|
>Custom Elements</a
|
|
>
|
|
are easy to integrate into any web application
|
|
framework.
|
|
</p>
|
|
<p>
|
|
Using Perspective's simple query language,
|
|
elements like
|
|
<code><perspective-viewer></code> can be
|
|
<i>symmetrically</i> configured via API or User
|
|
interaction. Web Applications built with
|
|
Perspective Custom Elements can be re-hydrated
|
|
from their serialized state, driven from external
|
|
Events, or persisted to any store. Workspaces
|
|
can mix virtual, server-side Python data with
|
|
in-browser client data seamlessly, and
|
|
independent data Views can be cross-filtered,
|
|
duplicated, exported, stacked and saved.
|
|
</p>
|
|
<p>
|
|
To achieve Desktop-like performance in the
|
|
Browser, Perspective.js relies on
|
|
<a href="https://webassembly.org/"
|
|
>WebAssembly</a
|
|
>
|
|
for excellent <i>query calculation</i> time, and
|
|
<a href="https://arrow.apache.org/"
|
|
>Apache Arrow</a
|
|
>
|
|
for its conservative <i>memory footprint</i> and
|
|
efficient <i>data serialization</i>.
|
|
</p>
|
|
</div>
|
|
|
|
<hr />
|
|
<br /><br /><br />
|
|
<div>
|
|
<h2>Python</h2>
|
|
<p>
|
|
<code>perspective-python</code>, built on the
|
|
same C++ data engine used by the
|
|
<a
|
|
href="https://perspective-dev.github.io/docs/md/js.html"
|
|
>WebAssembly version</a
|
|
>, implements the Perspective API directly in
|
|
Python, either as a virtualized server for
|
|
Production, or as an embedded JupyterLab Widget
|
|
for Research.
|
|
</p>
|
|
<p>
|
|
For Application Developers, virtualized
|
|
<code><perspective-viewer></code> will only
|
|
consume the data necessary to render the current
|
|
screen, enabling <i>ludicrous size</i> datasets
|
|
with nearly instant load. Or - efficiently stream
|
|
the entire dataset to the WebAssembly runtime via
|
|
Apache Arrow, and give your server a break!
|
|
</p>
|
|
<p>
|
|
For Researchers and Data Scientists,
|
|
<code>PerspectiveWidget</code> is available as a
|
|
<a
|
|
href="https://jupyterlab.readthedocs.io/en/stable/"
|
|
>Jupyter/JupyterLab</a
|
|
>
|
|
widget, allowing interactive
|
|
<a href="https://pandas.pydata.org/">Pandas</a>
|
|
and
|
|
<a href="https://arrow.apache.org/"
|
|
>Apache Arrow</a
|
|
>
|
|
visualization within a notebook.
|
|
</p>
|
|
</div>
|
|
<br />
|
|
<hr />
|
|
</div>
|
|
</section>
|
|
|
|
<section class="gallery-section">
|
|
<div class="gallery" id="gallery"></div>
|
|
<div style="max-width: 638px; margin: 0 auto">
|
|
<hr />
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="footer">
|
|
<div class="footer__inner">
|
|
<img
|
|
class="footer__logo"
|
|
id="footer-logo"
|
|
alt="OpenJS Foundation Logo"
|
|
src="/img/openjs_foundation-logo-horizontal-white.png"
|
|
/>
|
|
<div class="footer__copyright">
|
|
<br /><br />Copyright © 2017 OpenJS Foundation and
|
|
Perspective contributors.<br /><br />
|
|
All rights reserved. The OpenJS Foundation has registered
|
|
trademarks and uses trademarks. For a list of trademarks
|
|
of the OpenJS Foundation, please see our Trademark Policy
|
|
and Trademark List. Trademarks and logos not indicated on
|
|
the list of OpenJS Foundation trademarks are
|
|
trademarks™ or registered® trademarks of their
|
|
respective holders. Use of them does not imply any
|
|
affiliation with or endorsement by them.<br /><br />
|
|
<a href="https://openjsf.org">The OpenJS Foundation</a>
|
|
|
|
|
<a href="https://terms-of-use.openjsf.org"
|
|
>Terms of Use</a
|
|
>
|
|
|
|
|
<a href="https://privacy-policy.openjsf.org"
|
|
>Privacy Policy</a
|
|
>
|
|
| <a href="https://bylaws.openjsf.org">Bylaws</a> |
|
|
<a href="https://code-of-conduct.openjsf.org"
|
|
>Code of Conduct</a
|
|
>
|
|
|
|
|
<a href="https://trademark-policy.openjsf.org"
|
|
>Trademark Policy</a
|
|
>
|
|
|
|
|
<a href="https://trademark-list.openjsf.org"
|
|
>Trademark List</a
|
|
>
|
|
|
|
|
<a href="https://www.linuxfoundation.org/cookies"
|
|
>Cookie Policy</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
<script type="module" src="index.js"></script>
|
|
</body>
|
|
</html>
|