Platform
Resources
Pricing
Sign in
Get started
Christopher Pietsch
Visualization, Prototypes, ML, Data wrangling and Art.
Workspace
Fork
Published
pixijs
By
Christopher Pietsch
Edited
Jul 13, 2020
Importers
1 star
pixijs
Vias: fisheye view snappy mousemove
Final Prototype: cloud + list interaction
Fisheye: Zoomable UMAP image collection
Pixi Renderer
Insert cell
md
`# Pixi Renderer`
Insert cell
width
=
500
Insert cell
height
=
500
Insert cell
backgroundColor
=
0xEEEEEE
Insert cell
renderer
=
{
const
renderer
=
new
PIXI
.
Renderer
(
{
antialias
:
false
,
// default: false
transparent
:
false
,
// default: false
resolution
:
1
,
// default: 1
backgroundColor
,
width
,
height
}
)
;
invalidation
.
then
(
(
)
=>
{
console
.
log
(
"invalidation Renderer"
)
renderer
.
destroy
(
true
,
true
)
;
}
)
;
return
renderer
;
}
Insert cell
viewof
canvas
=
{
renderer
.
render
(
container
)
return
html
`${
renderer
.
view
}`
}
Insert cell
container
=
{
const
container
=
new
PIXI
.
Container
(
)
invalidation
.
then
(
(
)
=>
{
console
.
log
(
"invalidation container"
)
container
.
destroy
(
true
,
true
)
;
}
)
;
return
container
;
}
Insert cell
PIXI
=
require
(
"https://cdnjs.cloudflare.com/ajax/libs/pixi.js/5.2.1/pixi.js"
)
.
catch
(
(
)
=>
window
.
PIXI
)
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Try it for free
Learn more
Fork
View
Export
Show 3 comments
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
width
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
height
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
backgroundColor
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
renderer
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
canvas
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
container
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
PIXI
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML