2019-04-01 20:26:32 +02:00
|
|
|
[role="xpack"]
|
2019-08-21 23:12:22 +02:00
|
|
|
[[create-canvas-workpad]]
|
|
|
|
== Create a workpad
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
A Canvas _workpad_ provides you with a workspace where you can build presentations of your live data.
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
To create a workpad, you can:
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
* <<blank-canvas-workpad,Build fully customizable presentations of your own data>>
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
* <<canvas-template-workpad,Choose from a set of preconfigured workpad templates>>
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
* <<import-canvas-workpad,Import a workpad that someone else has already started>>
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
* <<sample-data-workpad,Gather inspiration from the {kib} sample data workpads>>
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
[float]
|
|
|
|
[[blank-canvas-workpad]]
|
|
|
|
=== Start with a blank page
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
To use the background colors, images, and data of your choice, start with a blank workpad.
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Open *Canvas*.
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. On the *Canvas workpads* view, click *Create workpad*.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Add a *Name* to your workpad.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. In the *Width* and *Height* fields, specify the size.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. Select the layout.
|
2018-11-08 20:50:51 +01:00
|
|
|
+
|
2019-07-09 19:59:42 +02:00
|
|
|
For example, click *720p* for a traditional presentation layout.
|
|
|
|
|
|
|
|
. Click the *Background color* picker, then select the background color for your workpad.
|
2018-11-08 20:50:51 +01:00
|
|
|
+
|
2019-08-21 23:12:22 +02:00
|
|
|
[role="screenshot"]
|
|
|
|
image::images/canvas-background-color-picker.gif[Canvas color picker]
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
[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.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Open *Canvas*.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. On the *Canvas workpads* view, select *Templates*.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Click the preconfigured template that you want to use.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Add your own *Name* to the workpad.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
|
|
|
[float]
|
2019-08-21 23:12:22 +02:00
|
|
|
[[import-canvas-workpad]]
|
|
|
|
=== Import an existing workpad
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
When you want to use a workpad that someone else has already started, import the JSON file into Canvas.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Open *Canvas*.
|
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. On the *Canvas workpads* view, click and drag the file to the *Import workpad JSON file* field.
|
2019-08-21 23:12:22 +02:00
|
|
|
|
|
|
|
[float]
|
|
|
|
[[sample-data-workpad]]
|
|
|
|
=== Use a sample data workpad
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
Each of the sample data sets comes with a Canvas workpad that you can use for your own workpad inspiration.
|
2019-07-09 19:59:42 +02:00
|
|
|
|
2019-10-31 16:45:43 +01:00
|
|
|
. Add a {kibana-ref}/add-sample-data.html[sample data set].
|
2019-08-21 23:12:22 +02:00
|
|
|
|
|
|
|
. On the *Add Data to Kibana* page, click the *View data* dropdown list, then select *Canvas*.
|
2019-07-09 19:59:42 +02:00
|
|
|
+
|
2019-10-31 16:45:43 +01:00
|
|
|
Need some more workpad inspiration? Check out the link:https://www.elastic.co/blog/[Elastic Blog].
|
2019-07-09 19:59:42 +02:00
|
|
|
|
|
|
|
[float]
|
2019-08-21 23:12:22 +02:00
|
|
|
[[apply-workpad-styles]]
|
|
|
|
== Apply a set of styles to the entire workpad
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
To make your workpad look exactly the way you want, use the editor on the right to apply CSS overrides.
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Expand *Global CSS overrides*.
|
2018-11-08 20:50:51 +01:00
|
|
|
|
2019-08-21 23:12:22 +02:00
|
|
|
. Enter the CSS. For example, to change the background on every page, enter:
|
|
|
|
+
|
|
|
|
[source,js]
|
|
|
|
--------------------------------------------------
|
|
|
|
.canvasPage {
|
|
|
|
background-color: #3990e6;
|
|
|
|
}
|
|
|
|
--------------------------------------------------
|
|
|
|
|
|
|
|
. Click *Apply stylesheet*.
|