This commit is contained in:
DuyHai DOAN 2016-05-09 14:43:25 +02:00
parent b15964544c
commit cc732aaf35
3 changed files with 23 additions and 23 deletions

View file

@ -47,7 +47,7 @@ Bind a value to an angular object and a **mandatory** target paragraph:
```
<img src="/assets/themes/zeppelin/img/screenshots/z_angularBind.gif" />
<img src="../assets/themes/zeppelin/img/screenshots/z_angularBind.gif" />
<hr/>
@ -63,7 +63,7 @@ Unbind/remove a value from angular object and a **mandatory** target paragraph:
```
<img src="/assets/themes/zeppelin/img/screenshots/z_angularUnbind.gif" />
<img src="../assets/themes/zeppelin/img/screenshots/z_angularUnbind.gif" />
The signature for the **`z.angularBind() / z.angularUnbind()`** functions are:
@ -97,7 +97,7 @@ You can also trigger paragraph execution by calling **`z.runParagraph()`** funct
```
<img src="/assets/themes/zeppelin/img/screenshots/z_runParagraph.gif" />
<img src="../assets/themes/zeppelin/img/screenshots/z_runParagraph.gif" />
<br />
### Overriding dynamic form with Angular Object
@ -109,7 +109,7 @@ The idea is to create a custom form using plain HTML/AngularJS code and bind act
Consequently if you use the **Dynamic Form** syntax in a paragraph and there is a bound Angular object having the same name as the _${formName}_, the Angular object will have higher priority and the **Dynamic Form** will not be displayed. Example:
<img src="/assets/themes/zeppelin/img/screenshots/z_angularJs_overriding_dynamic_form.gif" />
<img src="../assets/themes/zeppelin/img/screenshots/z_angularJs_overriding_dynamic_form.gif" />
<br />

View file

@ -34,12 +34,12 @@ To create text input form, use _${formName}_ templates.
for example
<img src="/assets/themes/zeppelin/img/screenshots/form_input.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_input.png" />
Also you can provide default value, using _${formName=defaultValue}_.
<img src="/assets/themes/zeppelin/img/screenshots/form_input_default.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_input_default.png" />
#### Select form
@ -48,21 +48,21 @@ To create select form, use _${formName=defaultValue,option1|option2...}_
for example
<img src="/assets/themes/zeppelin/img/screenshots/form_select.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_select.png" />
Also you can separate option's display name and value, using _${formName=defaultValue,option1(DisplayName)|option2(DisplayName)...}_
<img src="/assets/themes/zeppelin/img/screenshots/form_select_displayname.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_select_displayname.png" />
#### Checkbox form
For multi-selection, you can create a checkbox form using _${checkbox:formName=defaultValue1|defaultValue2...,option1|option2...}_. The variable will be substituted by a comma-separated string based on the selected items. For example:
<img src="/assets/themes/zeppelin/img/screenshots/form_checkbox.png">
<img src="../assets/themes/zeppelin/img/screenshots/form_checkbox.png">
Besides, you can specify the delimiter using _${checkbox(delimiter):formName=...}_:
<img src="/assets/themes/zeppelin/img/screenshots/form_checkbox_delimiter.png">
<img src="../assets/themes/zeppelin/img/screenshots/form_checkbox_delimiter.png">
### Creates Programmatically
@ -89,7 +89,7 @@ print("Hello "+z.input("name"))
</div>
</div>
<img src="/assets/themes/zeppelin/img/screenshots/form_input_prog.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_input_prog.png" />
####Text input form with default value
<div class="codetabs">
@ -110,7 +110,7 @@ print("Hello "+z.input("name", "sun"))
</div>
</div>
<img src="/assets/themes/zeppelin/img/screenshots/form_input_default_prog.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_input_default_prog.png" />
####Select form
<div class="codetabs">
@ -143,7 +143,7 @@ print("Hello "+z.select("day", [("1","mon"),
</div>
</div>
<img src="/assets/themes/zeppelin/img/screenshots/form_select_prog.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_select_prog.png" />
#### Checkbox form
<div class="codetabs">
@ -166,4 +166,4 @@ print("Hello "+ " and ".join(z.checkbox("fruit", options, ["apple"])))
</div>
</div>
<img src="/assets/themes/zeppelin/img/screenshots/form_checkbox_prog.png" />
<img src="../assets/themes/zeppelin/img/screenshots/form_checkbox_prog.png" />

View file

@ -48,7 +48,7 @@ The `Notebook` menu proposes almost the same features as the note management sec
2. Filter node by name
3. Create a new note
<img src="/assets/themes/zeppelin/img/ui-img/notebook_menu.png" />
<img src="../assets/themes/zeppelin/img/ui-img/notebook_menu.png" />
### 2. Interpreter
@ -57,13 +57,13 @@ In this menu you can:
1. Configure existing **interpreter instance**
2. Add/remove **interpreter instances**
<img src="/assets/themes/zeppelin/img/ui-img/interpreter_menu.png" />
<img src="../assets/themes/zeppelin/img/ui-img/interpreter_menu.png" />
### 3. Configuration
This menu displays all the Zeppelin configuration that are set in the config file `$ZEPPELIN_HOME/conf/zeppelin-site.xml`
<img src="/assets/themes/zeppelin/img/ui-img/configuration_menu.png" />
<img src="../assets/themes/zeppelin/img/ui-img/configuration_menu.png" />
<br />
@ -71,13 +71,13 @@ This menu displays all the Zeppelin configuration that are set in the config fil
Each Zeppelin note is composed of 1 .. N paragraphs. The note can be viewed as a paragraph container.
<img src="/assets/themes/zeppelin/img/ui-img/note_paragraph_layout.png" />
<img src="../assets/themes/zeppelin/img/ui-img/note_paragraph_layout.png" />
### Paragraph
Each paragraph consists of 2 sections: `code section` where you put your source code and `result section` where you can see the result of the code execution.
<img src="/assets/themes/zeppelin/img/ui-img/paragraph_layout.png" />
<img src="../assets/themes/zeppelin/img/ui-img/paragraph_layout.png" />
On the top-right corner of each paragraph there are some commands to:
@ -88,7 +88,7 @@ On the top-right corner of each paragraph there are some commands to:
To configure the paragraph, just click on the gear icon:
<img src="/assets/themes/zeppelin/img/ui-img/paragraph_configuration_dialog.png" />
<img src="../assets/themes/zeppelin/img/ui-img/paragraph_configuration_dialog.png" />
From this dialog, you can (in descending order):
@ -108,7 +108,7 @@ From this dialog, you can (in descending order):
At the top of the note, you can find a toolbar which exposes command buttons as well as configuration, security and display options
<img src="/assets/themes/zeppelin/img/ui-img/note_toolbar.png" />
<img src="../assets/themes/zeppelin/img/ui-img/note_toolbar.png" />
On the far right is displayed the note name, just click on it to reveal the input form and update it
@ -124,7 +124,7 @@ In the middle of the toolbar you can find the command buttons:
* delete the note
* schedule the execution of **all paragraph** using a CRON syntax
<img src="/assets/themes/zeppelin/img/ui-img/note_commands.png" />
<img src="../assets/themes/zeppelin/img/ui-img/note_commands.png" />
On the right of the note tool bar you can find configuration icons:
@ -133,7 +133,7 @@ On the right of the note tool bar you can find configuration icons:
* configure the note permissions
* switch the node display mode between `default`, `simple` and `report`
<img src="/assets/themes/zeppelin/img/ui-img/note_configuration.png" />
<img src="../assets/themes/zeppelin/img/ui-img/note_configuration.png" />