PlutoVista.jl
Plot library for Pluto notebooks based on plotly.js for 1D data and vtk.js (thus using WebGL) for 2/3D data.
It uses the Pluto 💁 API to make objects available inside JS to pass plot data from Julia to HTML5.
Please see:
So far, this package is in an early state.
PlutoVistaPlot
PlutoVista.PlutoVistaPlot — Typemutable struct PlutoVistaPlotPlutoVistaPlot is a wrapper struct around different possible backends. As default, for 1D plots, PlutoPlotlyPlot and for 2D and 3D plots, PlutoVTKPlot are chosen. The backend is automatically chosen when the first plot is invoked.
PlutoVista.PlutoVistaPlot — MethodPlutoVistaPlot(; resolution, kwargs...)
Constructor for PlutoVistaPlot.
Relevant keyword arguments:
resolution: Screen resolution in pixelsdim: Space dimension of subsequent plots
1D plots
PlutoVista.plot — Functionplot(x, y; kwargs...)
Plot y over y.
Arguments:
xvector of x coordinatesyvector of y coordinates (function values)
Keyword arguments:
limits=(1,-1): function limitsxlimits=(1,-1): x axis limitsxlabel="": x axis labelylabel="": y axis label- `title="" : plot title
 xscale=:linear: linear or log scale for x axisyscale=:linear: linear or log scale for y axislegend=:none: legend placement (:lt,:rt ...)clear=false: clear plot contentslabel="": label of particular plotcolor=:autotitlefontsize=12axisfontsize=10tickfontsize=10legendfontsize=10linewidth=2linestyle=:solid:markersize=6markercount=10markertype=:none, possible values::dtriangle,:utriangle,:rtriangle,:ltriangle,:circle,:square,:cross,:+,:xcross,:x,:diamond,:star5,:pentagon, `:hexagon
plot(; datadim, backend, kwargs...)
Create empty 1D plot.
PlutoVista.plot! — Methodplot!(p, x, y; backend, clear, kwargs...)
Add additional x-y plot to p
2D plots
When using vtk.js (default), interactive control via mouse includes the following actions:
- Left Mouse + Shift: Pan
 - Left Mouse + Ctrl/Alt: Reset camera
 - Left Mouse + Shift + Ctrl/Alt: Dolly (Zoom)
 - Mouse Wheel: Dolly (Zoom)
 - Multi-Touch Pinch: Dolly (Zoom)
 - Multi-Touch Pan: Pan
 - 3D Events: Camera Pose
 
Compared to vtk.js, keyboard interaction and rotation have been disabled, "spin" has been replaced by "reset camera".
PlutoVista.tricontour — Functiontricontour(pts, tris, f; kwargs...)
Filled colored tricontour with isolines. By default, a vtk.js based backend is used. Plots piecewise linear function on triangular grid.
Arguments:
pts:2 x n_pointsarray of point coordinatestris:3 x n_trisarray of point indices describing trianglesf:n-vector of function values
Keyword arguments:
title=""clear=falsexlabel="x": x axis labelylabel="y": y axis labelcolormap=:viridislevels=0: either number of interior isolevels, or vector of isolevel valuescolorbarticks=:default: colorbar ticks. Default: levelslimits=:auto: function limitsaspect=1: xy aspect ratio (plotly backend)
tricontour(; kwargs...)
Create empty tricontour plot
PlutoVista.tricontour! — Methodtricontour!(p, pts, tris, f; backend, kwargs...)
Add tricontour to existing plot
PlutoVista.quiver2d — Functionquiver2d(pts, qvec; kwargs...)
Quiver plot, using vtk.js backend.
Arguments:
pts:2 x n_ptsarray of pointsqvec:2 x n_ptsarray of vector values
quiver2d(; kwargs...)
Create empty quiver plot
PlutoVista.quiver2d! — Methodquiver2d!(p, pts, qvec; backend, kwargs...)
Add quiver to existing plot
PlutoVista.trimesh — Functiontrimesh(pts, tris; kwargs...)
Plot triangular mesh, showing triangle boundaries and outer boundaries, using vtk.js backend.
Arguments:
pts:2 x n_pointsarray of point coordinatestris:3 x n_trisarray of point indices describing triangles
Keyword arguments:
markers=nothing: Optionaln_trisinteger vector of triangle markerscolormap: optional colormap for triangle markersedges:2 x n_edgesoptional array of point indices describing edgesedgemarkers=nothing: optionaln_edgesvector of integer edge markersedgecolormap=nothing: optional colormap for edge markersshow_colorbar=true: optional show the colorbar next to the plot
trimesh(; kwargs...)
Create empty trimesh plot.
PlutoVista.trimesh! — Methodtrimesh!(p, pts, tris; backend, kwargs...)
Add trimesh to plot.
3D plots
When using vtk.js (default), interactive control via mouse includes the following actions:
- Left Mouse: Rotate
 - Left Mouse + Shift: Pan
 - Left Mouse + Ctrl/Alt: Reset camera
 - Left Mouse + Shift + Ctrl/Alt: Dolly (Zoom)
 - Mouse Wheel: Dolly (Zoom)
 - Multi-Touch Rotate: Rotate
 - Multi-Touch Pinch: Dolly (Zoom)
 - Multi-Touch Pan: Pan
 - 3D Events: Camera Pose
 
Compared to vtk.js, keyboard interaction has been disabled, and "spin" has been replaced by "reset camera".
PlutoVista.tetcontour — Functiontetcontour(pts, tets, f; kwargs...)
Plot piecewise linear function on tetrahedral grid using vtk backend. The plot consists of three parts:
- Transparent isosurfaces of function values according to 
levels - Transparent plane cuts with function "hetmapes" according to 
xplanes,yplanes,zplanes - Transparent domain outline
 
Arguments:
pts:3 x n_pointsarray of point coordinatestets:4 x n_tetsarray of point indices describing tetrahedraf:n_points-vector of function values
Keyword arguments:
title=""clear=falsecolormap=:viridisfaces=nothing: optional3 x n_facesarray of boundary facesfacemarkers=nothing: optionaln_facesinteger vector of face markersfacecolormap=nothing: optional colormap of facemarkerslevels=0: either number of interior isolevels, or vector of isolevel valueslimits=:auto: function limitsxplanes: either number or array of x coordinate values of x-orthogonal plane sectionsyplanes: either number or array of y coordinate values of y-orthogonal plane sectionszplanes: either number or array of z coordinate values of z-orthogonal plane sectionslevelalpha=0.25: alpha value for isosurfaces and plane cutsoutlinealpha=0.1: alpha value for outline. Outliene is for value 0.0
tetcontour(; kwargs...)
Create empty tetcontour plot.
PlutoVista.tetcontour! — Methodtetcontour!(p, pts, tets, f; backend, kwargs...)
Add tetcontour to plot
PlutoVista.tetmesh — Functiontetmesh(pts, tets; kwargs...)
Plot tetrahedral mesh, showing tetrahedron boundaries and outer boundaries, using vtk.js backend. The plot consists of two parts:
- A subset of tetrahedra visible after cutting of all tets with are on the positive side of the respective x, y, z planes
 - A transpatemt outline of the boundary.
 
Arguments:
pts:3 x n_pointsarray of point coordinatestets:4 x n_trisarray of point indices describing tetrahedra
Keyword arguments:
markers=nothing: Optionaln_tetsinteger vector of tetrahedron markerscolormap: optional colormap for tetrahedron markersfaces=nothing: optional3 x n_facesarray of boundary facesfacemarkers=nothing: optionaln_facesinteger vector of face markersfacecolormap=nothing: optional colormap of facemarkersxplanes: array of x coordinate values for cut-off in x-directionyplanes: array of y coordinate values for cut-off in y-directionzplanes: array of z coordinate values for cut-off in z-directionoutlinealpha=0.1: alpha value for outline. Outliene is for value 0.0show_colorbar=true: optional show the colorbar next to the plot
tetmesh(; kwargs...)
Create empty tetmesh plot.
PlutoVista.tetmesh! — Methodtetmesh!(p, pts, tets; backend, kwargs...)
Add tetmesh to plot
Pluto utilities
PlutoVista.ScreenWidthGrabber — Type@bind width ScreenWidthGrabber()Detect screen width from pluto notebook. (see https://discourse.julialang.org/t/cell-width-in-pluto-notebook/49761/3)
PlutoVista.PlutoCellWidener — TypePlutoCellWidener(px)Set pluto cell width to a given number of pixels.
(see https://discourse.julialang.org/t/cell-width-in-pluto-notebook/49761/3)
Setting width larger than standard may interfer with other Pluto functionality.