kibana/docs/canvas/canvas-workpad.asciidoc
Kaarina Tungseth 896b9cddbc
[DOCS] Updates for navigation redesign (#68709)
* [DOCS] Updates for navigation redesign

* Getting started

* Set up text

* Discover

* Dashboard, Graph, ML, Maps, APM, SIEM, Dev tools

* Dev Tools, Stack Monitoring, Management

* Management

* Final changes

* [DOCS] Updates for navigation redesign

* [DOCS] Updates CCR monitoring screenshots

* updates SIEM screenshot and Cases overview text

* Added Brandon's APM image

* [DOCS] Refines CCR shard screenshot

* Removed merge conflict image file

Co-authored-by: lcawl <lcawley@elastic.co>
Co-authored-by: Ben Skelker <ben.skelker@elastic.co>
2020-06-12 09:39:36 -05:00

141 lines
3.7 KiB
Plaintext

[role="xpack"]
[[create-canvas-workpad]]
== Create a workpad
A Canvas _workpad_ provides you with a workspace where you can build presentations of your live data.
To create a workpad, choose one of the following options:
* <<blank-canvas-workpad,Build fully customizable presentations of your own data>>
* <<canvas-template-workpad,Choose from a set of preconfigured workpad templates>>
* <<sample-data-workpad,Gather inspiration from the {kib} sample data workpads>>
* <<import-canvas-workpad,Import a workpad that someone else has already started>>
[float]
[[blank-canvas-workpad]]
=== Start with a blank workpad
To use the background colors, images, and data of your choice, start with a blank workpad.
. Open the menu, then go to *Canvas*.
. On the *Canvas workpads* view, click *Create workpad*.
. Add a *Name* to your workpad.
. In the *Width* and *Height* fields, specify the size.
. Select the layout.
+
For example, click *720p* for a traditional presentation layout.
. Click the *Background color* picker, then select the background color for your workpad.
+
[role="screenshot"]
image::images/canvas-background-color-picker.png[Canvas color picker]
[float]
[[canvas-template-workpad]]
=== Create a workpad from a template
If you're unsure about where to start, you can use one of the preconfigured templates that come with Canvas.
. Open the menu, then go to *Canvas*.
. On the *Canvas workpads* view, select *Templates*.
. Click the preconfigured template that you want to use.
. Add your own *Name* to the workpad.
[float]
[[import-canvas-workpad]]
=== Import an existing workpad
When you want to use a workpad that someone else has already started, import the JSON file into Canvas.
. Open the menu, then go to *Canvas*.
. On the *Canvas workpads* view, click and drag the file to the *Import workpad JSON file* field.
[float]
[[sample-data-workpad]]
=== Use a sample data workpad
Each of the sample data sets comes with a Canvas workpad that you can use for your own workpad inspiration.
. Add a {kibana-ref}/add-sample-data.html[sample data set].
. On the *Add Data* page, click *View data*, then select *Canvas*.
[float]
[[apply-workpad-styles]]
=== Apply a set of styles to the entire workpad
To make your workpad look exactly the way you want, use the editor to apply CSS overrides.
. Expand *Global CSS overrides*.
. Enter the CSS.
+
For example, to change the background on every page, enter:
+
[source,text]
--------------------------------------------------
.canvasPage {
background-color: #3990e6;
}
--------------------------------------------------
. Click *Apply stylesheet*.
[float]
[[configure-auto-refresh-interval]]
=== Change the auto-refresh interval
Change how often the data refreshes on your workpad.
. Click *View > Auto refresh settings*.
. Select the interval you want to use, or *Set a custom interval*.
+
[role="screenshot"]
image::images/canvas-refresh-interval.png[Element data refresh interval]
+
To manually refresh the data, click image:canvas/images/canvas-refresh-data.png[].
[float]
[[zoom-in-out]]
=== Use the zoom options
To get a closer look at a portion of your workpad, use the zoom options.
. Click *View > Zoom*.
. Select the zoom option.
+
[role="screenshot"]
image::images/canvas-zoom-controls.png[Zoom controls]
[float]
[[add-more-pages]]
=== Add pages
Organize your ideas onto separate pages by adding more pages.
. Click *Page 1*, then click *+*.
. On the *Page* editor panel, select the page transition from the *Transition* dropdown.
+
[role="screenshot"]
image::images/canvas-add-pages.gif[Add pages]
include::{kib-repo-dir}/canvas/canvas-elements.asciidoc[]
include::{kib-repo-dir}/canvas/canvas-present-workpad.asciidoc[]
include::{kib-repo-dir}/canvas/canvas-share-workpad.asciidoc[]