Added:
zeppelin/site/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html
URL:
http://svn.apache.org/viewvc/zeppelin/site/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html?rev=1751605&view=auto
==============================================================================
---
zeppelin/site/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html
(added)
+++
zeppelin/site/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html
Wed Jul 6 06:25:29 2016
@@ -0,0 +1,388 @@
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Writing Zeppelin Interpreter</title>
+ <meta name="description" content="">
+ <meta name="author" content="The Apache Software Foundation">
+
+ <!-- Enable responsive viewport -->
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+ <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <link
href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
rel="stylesheet">
+
+ <!-- Le styles -->
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/css/bootstrap.css"
rel="stylesheet">
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/style.css?body=1"
rel="stylesheet" type="text/css">
+ <link href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/syntax.css"
rel="stylesheet" type="text/css" media="screen" />
+ <!-- Le fav and touch icons -->
+ <!-- Update these with your own images
+ <link rel="shortcut icon" href="images/favicon.ico">
+ <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+ <link rel="apple-touch-icon" sizes="72x72"
href="images/apple-touch-icon-72x72.png">
+ <link rel="apple-touch-icon" sizes="114x114"
href="images/apple-touch-icon-114x114.png">
+ -->
+
+ <!-- Js -->
+ <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/docs.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.7.0-SNAPSHOT/atom.xml" type="application/atom+xml"
rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.7.0-SNAPSHOT/rss.xml" type="application/rss+xml"
rel="alternate" title="Sitewide RSS Feed">
+ </head>
+
+ <body>
+
+ <div id="menu" class="navbar navbar-inverse navbar-fixed-top"
role="navigation">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="/docs/0.7.0-SNAPSHOT">
+ <img src="/assets/themes/zeppelin/img/zeppelin_logo.png"
width="50" alt="I'm zeppelin">
+ <span style="vertical-align:middle">Zeppelin</span>
+ <span
style="vertical-align:baseline"><small>0.7.0-SNAPSHOT</small></span>
+ </a>
+ </div>
+ <nav class="navbar-collapse collapse" role="navigation">
+ <ul class="nav navbar-nav">
+ <li>
+ <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick
Start <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="/docs/0.7.0-SNAPSHOT/index.html">What is Apache
Zeppelin ?</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Getting Started</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html">Install</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/explorezeppelinui.html">Explore Zeppelin
UI</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/tutorial.html">Tutorial</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Basic Feature Guide</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.7.0-SNAPSHOT/manual/publish.html">Publish
your Paragraph</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/notebookashomepage.html">Customize Zeppelin
Homepage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>More</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant
VM</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/upgrade.html">Upgrade Zeppelin
Version</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu">
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreters.html">Overview</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Usage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreterinstallation.html">Interpreter
Installation</a></li>
+ <!--<li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicinterpreterload.html">Dynamic
Interpreter Loading</a></li>-->
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dependencymanagement.html">Interpreter
Dependency Management</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Available
Interpreters</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/flink.html">Flink</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/geode.html">Geode</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hbase.html">HBase</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hdfs.html">HDFS</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hive.html">Hive</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/ignite.html">Ignite</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/jdbc.html">JDBC</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/lens.html">Lens</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/livy.html">Livy</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/markdown.html">Markdown</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/python.html">Python</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/postgresql.html">Postgresql,
HAWQ</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/r.html">R</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/scalding.html">Scalding</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/pleasecontribute.html">Shell</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/spark.html">Spark</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Display System <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li class="title"><span><b>Basic Display System</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#table">Table</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Angular API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html">Angular
(backend API)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/front-end-angular.html">Angular
(frontend API)</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">More<b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu" style="right: 0; left:
auto;">
+ <li class="title"><span><b>Notebook Storage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-local-git-repository">Git
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-s3">S3
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-azure">Azure
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#storage-in-zeppelinhub">ZeppelinHub
Storage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>REST API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-interpreter.html">Interpreter
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-configuration.html">Configuration
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-credential.html">Credential
API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/authentication.html">Authentication for
NGINX</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/shiroauthentication.html">Shiro
Authentication</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/notebook_authorization.html">Notebook
Authorization</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/interpreter_authorization.html">Interpreter
& Data Resource Authorization</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Contibute</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html">Writing
Zeppelin Interpreter</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing
Zeppelin Application</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontribute.html">How to contribute
(code)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontributewebsite.html">How to
contribute (website)</a></li>
+ </ul>
+ </li>
+ </ul>
+ </nav><!--/.navbar-collapse -->
+ </div>
+ </div>
+
+
+ <div class="content">
+
+<!--<div class="hero-unit Writing Zeppelin Interpreter">
+ <h1></h1>
+</div>
+-->
+
+<div class="row">
+ <div class="col-md-12">
+ <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Writing a New Interpreter</h1>
+
+<div id="toc"></div>
+
+<h2>What is Apache Zeppelin Interpreter</h2>
+
+<p>Apache Zeppelin Interpreter is a language backend. For example to use scala
code in Zeppelin, you need a scala interpreter.
+Every Interpreters belongs to an <strong>InterpreterGroup</strong>.
+Interpreters in the same InterpreterGroup can reference each other. For
example, SparkSqlInterpreter can reference SparkInterpreter to get SparkContext
from it while they're in the same group.</p>
+
+<p><img class="img-responsive" style="width:50%; border: 1px solid #ecf0f1;"
height="auto" src="/assets/themes/zeppelin/img/interpreter.png" /></p>
+
+<p><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-zengine/src/main/java/org/apache/zeppelin/interpreter/InterpreterSetting.java">InterpreterSetting</a>
is configuration of a given <a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-interpreter/src/main/java/org/apache/zeppelin/interpreter/InterpreterGroup.java">InterpreterGroup</a>
and a unit of start/stop interpreter.
+All Interpreters in the same InterpreterSetting are launched in a single,
separate JVM process. The Interpreter communicates with Zeppelin engine via
<strong><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-interpreter/src/main/thrift/RemoteInterpreterService.thrift">Thrift</a></strong>.</p>
+
+<p>In 'Separate Interpreter(scoped / isolated) for each note' mode
which you can see at the <strong>Interpreter Setting</strong> menu when you
create a new interpreter, new interpreter instance will be created per
notebook. But it still runs on the same JVM while they're in the same
InterpreterSettings.</p>
+
+<h2>Make your own Interpreter</h2>
+
+<p>Creating a new interpreter is quite simple. Just extend <a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-interpreter/src/main/java/org/apache/zeppelin/interpreter/Interpreter.java">org.apache.zeppelin.interpreter</a>
abstract class and implement some methods.
+You can include
<code>org.apache.zeppelin:zeppelin-interpreter:[VERSION]</code> artifact in
your build system. And you should your jars under your interpreter directory
with specific directory name. Zeppelin server reads interpreter directories
recursively and initializes interpreters including your own interpreter.</p>
+
+<p>There are three locations where you can store your interpreter group, name
and other information. Zeppelin server tries to find the location below. Next,
Zeppelin tries to find <code>interpareter-setting.json</code> in your
interpreter jar. </p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">{ZEPPELIN_INTERPRETER_DIR}/{YOUR_OWN_INTERPRETER_DIR}/interpreter-setting.json
+</code></pre></div>
+<p>Here is an example of <code>interpareter-setting.json</code> on your own
interpreter.</p>
+<div class="highlight"><pre><code class="json language-json"
data-lang="json"><span class="p">[</span>
+ <span class="p">{</span>
+ <span class="nt">"group"</span><span class="p">:</span> <span
class="s2">"your-group"</span><span class="p">,</span>
+ <span class="nt">"name"</span><span class="p">:</span> <span
class="s2">"your-name"</span><span class="p">,</span>
+ <span class="nt">"className"</span><span class="p">:</span>
<span class="s2">"your.own.interpreter.class"</span><span
class="p">,</span>
+ <span class="nt">"properties"</span><span class="p">:</span>
<span class="p">{</span>
+ <span class="nt">"propertiies1"</span><span class="p">:</span>
<span class="p">{</span>
+ <span class="nt">"envName"</span><span class="p">:</span>
<span class="kc">null</span><span class="p">,</span>
+ <span class="nt">"propertyName"</span><span
class="p">:</span> <span class="s2">"property.1.name"</span><span
class="p">,</span>
+ <span class="nt">"defaultValue"</span><span
class="p">:</span> <span
class="s2">"propertyDefaultValue"</span><span class="p">,</span>
+ <span class="nt">"description"</span><span
class="p">:</span> <span class="s2">"Property description"</span>
+ <span class="p">},</span>
+ <span class="nt">"properties2"</span><span class="p">:</span>
<span class="p">{</span>
+ <span class="nt">"envName"</span><span class="p">:</span>
<span class="err">PROPERTIES_</span><span class="mi">2</span><span
class="p">,</span>
+ <span class="nt">"propertyName"</span><span
class="p">:</span> <span class="kc">null</span><span class="p">,</span>
+ <span class="nt">"defaultValue"</span><span
class="p">:</span> <span
class="s2">"property2DefaultValue"</span><span class="p">,</span>
+ <span class="nt">"description"</span><span
class="p">:</span> <span class="s2">"Property 2 description"</span>
+ <span class="p">},</span> <span class="err">...</span>
+ <span class="p">}</span>
+ <span class="p">},</span>
+ <span class="p">{</span>
+ <span class="err">...</span>
+ <span class="p">}</span>
+<span class="p">]</span>
+</code></pre></div>
+<p>Finally, Zeppelin uses static initialization with the following:</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">static {
+ Interpreter.register("MyInterpreterName",
MyClassName.class.getName());
+ }
+</code></pre></div>
+<p><strong>Static initialization is deprecated and will be supported until
0.6.0.</strong></p>
+
+<p>The name will appear later in the interpreter name option box during the
interpreter configuration process.
+The name of the interpreter is what you later write to identify a paragraph
which should be interpreted using this interpreter.</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%MyInterpreterName
+some interpreter specific code...
+</code></pre></div>
+<h2>Programming Languages for Interpreter</h2>
+
+<p>If the interpreter uses a specific programming language ( like Scala,
Python, SQL ), it is generally recommended to add a syntax highlighting
supported for that to the notebook paragraph editor. </p>
+
+<p>To check out the list of languages supported, see the
<code>mode-*.js</code> files under
<code>zeppelin-web/bower_components/ace-builds/src-noconflict</code> or from <a
href="https://github.com/ajaxorg/ace-builds/tree/master/src-noconflict">github.com/ajaxorg/ace-builds</a>.
</p>
+
+<p>If you want to add a new set of syntax highlighting, </p>
+
+<ol>
+<li>Add the <code>mode-*.js</code> file to <code><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/bower.json">zeppelin-web/bower.json</a></code>
( when built, <code><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/index.html">zeppelin-web/src/index.html</a></code>
will be changed automatically. ).<br></li>
+<li>Add to the list of <code>editorMode</code> in <code><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js">zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js</a></code>
- it follows the pattern 'ace/mode/x' where x is the name.<br></li>
+<li>Add to the code that checks for <code>%</code> prefix and calls
<code>session.setMode(editorMode.x)</code> in <code>setParagraphMode</code>
located in <code><a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js">zeppelin-web/src/app/notebook/paragraph/paragraph.controller.js</a></code>.<br></li>
+</ol>
+
+<h2>Install your interpreter binary</h2>
+
+<p>Once you have built your interpreter, you can place it under the
interpreter directory with all its dependencies.</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">[ZEPPELIN_HOME]/interpreter/[INTERPRETER_NAME]/
+</code></pre></div>
+<h2>Configure your interpreter</h2>
+
+<p>To configure your interpreter you need to follow these steps:</p>
+
+<ol>
+<li><p>Add your interpreter class name to the zeppelin.interpreters property
in <code>conf/zeppelin-site.xml</code>.</p>
+
+<p>Property value is comma separated [INTERPRETER_CLASS_NAME].
+For example,</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text"><property>
+<name>zeppelin.interpreters</name>
+<value>org.apache.zeppelin.spark.SparkInterpreter,org.apache.zeppelin.spark.PySparkInterpreter,org.apache.zeppelin.spark.SparkSqlInterpreter,org.apache.zeppelin.spark.DepInterpreter,org.apache.zeppelin.markdown.Markdown,org.apache.zeppelin.shell.ShellInterpreter,org.apache.zeppelin.hive.HiveInterpreter,com.me.MyNewInterpreter</value>
+</property>
+</code></pre></div></li>
+<li><p>Add your interpreter to the <a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-zengine/src/main/java/org/apache/zeppelin/conf/ZeppelinConfiguration.java#L397">default
configuration</a> which is used when there is no
<code>zeppelin-site.xml</code>.</p></li>
+<li><p>Start Zeppelin by running <code>./bin/zeppelin-daemon.sh
start</code>.</p></li>
+<li><p>In the interpreter page, click the <code>+Create</code> button and
configure your interpreter properties.
+Now you are done and ready to use your interpreter.</p></li>
+</ol>
+
+<blockquote>
+<p><strong>Note :</strong> Interpreters released with zeppelin have a <a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-zengine/src/main/java/org/apache/zeppelin/conf/ZeppelinConfiguration.java#L397">default
configuration</a> which is used when there is no
<code>conf/zeppelin-site.xml</code>.</p>
+</blockquote>
+
+<h2>Use your interpreter</h2>
+
+<h3>0.5.0</h3>
+
+<p>Inside of a notebook, <code>%[INTERPRETER_NAME]</code> directive will call
your interpreter.
+Note that the first interpreter configuration in zeppelin.interpreters will be
the default one.</p>
+
+<p>For example,</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%myintp
+
+val a = "My interpreter"
+println(a)
+</code></pre></div>
+<h3>0.6.0 and later</h3>
+
+<p>Inside of a notebook, <code>%[INTERPRETER_GROUP].[INTERPRETER_NAME]</code>
directive will call your interpreter.
+Note that the first interpreter configuration in zeppelin.interpreters will be
the default one.</p>
+
+<p>You can omit either [INTERPRETER_GROUP] or [INTERPRETER_NAME]. If you omit
[INTERPRETER_NAME], then first available interpreter will be selected in the
[INTERPRETER_GROUP].
+Likewise, if you skip [INTERPRETER_GROUP], then [INTERPRETER_NAME] will be
chosen from default interpreter group.</p>
+
+<p>For example, if you have two interpreter myintp1 and myintp2 in group
mygrp, you can call myintp1 like</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%mygrp.myintp1
+
+codes for myintp1
+</code></pre></div>
+<p>and you can call myintp2 like</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%mygrp.myintp2
+
+codes for myintp2
+</code></pre></div>
+<p>If you omit your interpreter name, it'll select first available
interpreter in the group ( myintp1 ).</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%mygrp
+
+codes for myintp1
+</code></pre></div>
+<p>You can only omit your interpreter group when your interpreter group is
selected as a default group.</p>
+<div class="highlight"><pre><code class="text language-text"
data-lang="text">%myintp2
+
+codes for myintp2
+</code></pre></div>
+<h2>Examples</h2>
+
+<p>Checkout some interpreters released with Zeppelin by default.</p>
+
+<ul>
+<li><a
href="https://github.com/apache/zeppelin/tree/master/spark">spark</a></li>
+<li><a
href="https://github.com/apache/zeppelin/tree/master/markdown">markdown</a></li>
+<li><a
href="https://github.com/apache/zeppelin/tree/master/shell">shell</a></li>
+<li><a href="https://github.com/apache/zeppelin/tree/master/jdbc">jdbc</a></li>
+</ul>
+
+<h2>Contributing a new Interpreter to Zeppelin releases</h2>
+
+<p>We welcome contribution to a new interpreter. Please follow these few
steps:</p>
+
+<ul>
+<li>First, check out the general contribution guide <a
href="https://github.com/apache/zeppelin/blob/master/CONTRIBUTING.md">here</a>.</li>
+<li>Follow the steps in <a href="#make-your-own-interpreter">Make your own
Interpreter</a> section above.</li>
+<li>Add your interpreter as in the <a
href="#configure-your-interpreter">Configure your interpreter</a> section
above; also add it to the example template <a
href="https://github.com/apache/zeppelin/blob/master/conf/zeppelin-site.xml.template">zeppelin-site.xml.template</a>.</li>
+<li>Add tests! They are run by <a
href="https://travis-ci.org/apache/zeppelin">Travis</a> for all changes and it
is important that they are self-contained.</li>
+<li>Include your interpreter as a module in <a
href="https://github.com/apache/zeppelin/blob/master/pom.xml"><code>pom.xml</code></a>.</li>
+<li>Add documentation on how to use your interpreter under
<code>docs/interpreter/</code>. Follow the Markdown style as this <a
href="https://github.com/apache/zeppelin/blob/master/docs/interpreter/elasticsearch.md">example</a>.
Make sure you list config settings and provide working examples on using your
interpreter in code boxes in Markdown. Link to images as appropriate (images
should go to <code>docs/assets/themes/zeppelin/img/docs-img/</code>). And add a
link to your documentation in the navigation menu
(<code>docs/_includes/themes/zeppelin/_navigation.html</code>).</li>
+<li>Most importantly, ensure licenses of the transitive closure of all
dependencies are list in <a
href="https://github.com/apache/zeppelin/blob/master/zeppelin-distribution/src/bin_license/LICENSE">license
file</a>.</li>
+<li>Commit your changes and open a <a
href="https://github.com/apache/zeppelin/pulls">Pull Request</a> on the project
<a href="https://github.com/apache/zeppelin">Mirror on GitHub</a>; check to
make sure Travis CI build is passing.</li>
+</ul>
+
+ </div>
+</div>
+
+
+ <hr>
+ <footer>
+ <!-- <p>© 2016 The Apache Software Foundation</p>-->
+ </footer>
+ </div>
+
+
+
+
+ <script type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new
Date();a=s.createElement(o),
+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+ ga('require', 'linkid', 'linkid.js');
+ ga('send', 'pageview');
+
+</script>
+
+
+
+ </body>
+</html>
+
Propchange:
zeppelin/site/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html
------------------------------------------------------------------------------
svn:eol-style = native
Added: zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html
URL:
http://svn.apache.org/viewvc/zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html?rev=1751605&view=auto
==============================================================================
--- zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html
(added)
+++ zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html Wed
Jul 6 06:25:29 2016
@@ -0,0 +1,383 @@
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Angular (backend API)</title>
+ <meta name="description" content="Angular (backend API)">
+ <meta name="author" content="The Apache Software Foundation">
+
+ <!-- Enable responsive viewport -->
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+ <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <link
href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
rel="stylesheet">
+
+ <!-- Le styles -->
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/css/bootstrap.css"
rel="stylesheet">
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/style.css?body=1"
rel="stylesheet" type="text/css">
+ <link href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/syntax.css"
rel="stylesheet" type="text/css" media="screen" />
+ <!-- Le fav and touch icons -->
+ <!-- Update these with your own images
+ <link rel="shortcut icon" href="images/favicon.ico">
+ <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+ <link rel="apple-touch-icon" sizes="72x72"
href="images/apple-touch-icon-72x72.png">
+ <link rel="apple-touch-icon" sizes="114x114"
href="images/apple-touch-icon-114x114.png">
+ -->
+
+ <!-- Js -->
+ <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/docs.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.7.0-SNAPSHOT/atom.xml" type="application/atom+xml"
rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.7.0-SNAPSHOT/rss.xml" type="application/rss+xml"
rel="alternate" title="Sitewide RSS Feed">
+ </head>
+
+ <body>
+
+ <div id="menu" class="navbar navbar-inverse navbar-fixed-top"
role="navigation">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="/docs/0.7.0-SNAPSHOT">
+ <img src="/assets/themes/zeppelin/img/zeppelin_logo.png"
width="50" alt="I'm zeppelin">
+ <span style="vertical-align:middle">Zeppelin</span>
+ <span
style="vertical-align:baseline"><small>0.7.0-SNAPSHOT</small></span>
+ </a>
+ </div>
+ <nav class="navbar-collapse collapse" role="navigation">
+ <ul class="nav navbar-nav">
+ <li>
+ <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick
Start <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="/docs/0.7.0-SNAPSHOT/index.html">What is Apache
Zeppelin ?</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Getting Started</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html">Install</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/explorezeppelinui.html">Explore Zeppelin
UI</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/tutorial.html">Tutorial</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Basic Feature Guide</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.7.0-SNAPSHOT/manual/publish.html">Publish
your Paragraph</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/notebookashomepage.html">Customize Zeppelin
Homepage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>More</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant
VM</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/upgrade.html">Upgrade Zeppelin
Version</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu">
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreters.html">Overview</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Usage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreterinstallation.html">Interpreter
Installation</a></li>
+ <!--<li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicinterpreterload.html">Dynamic
Interpreter Loading</a></li>-->
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dependencymanagement.html">Interpreter
Dependency Management</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Available
Interpreters</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/flink.html">Flink</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/geode.html">Geode</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hbase.html">HBase</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hdfs.html">HDFS</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hive.html">Hive</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/ignite.html">Ignite</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/jdbc.html">JDBC</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/lens.html">Lens</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/livy.html">Livy</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/markdown.html">Markdown</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/python.html">Python</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/postgresql.html">Postgresql,
HAWQ</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/r.html">R</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/scalding.html">Scalding</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/pleasecontribute.html">Shell</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/spark.html">Spark</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Display System <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li class="title"><span><b>Basic Display System</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#table">Table</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Angular API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html">Angular
(backend API)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/front-end-angular.html">Angular
(frontend API)</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">More<b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu" style="right: 0; left:
auto;">
+ <li class="title"><span><b>Notebook Storage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-local-git-repository">Git
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-s3">S3
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-azure">Azure
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#storage-in-zeppelinhub">ZeppelinHub
Storage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>REST API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-interpreter.html">Interpreter
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-configuration.html">Configuration
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-credential.html">Credential
API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/authentication.html">Authentication for
NGINX</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/shiroauthentication.html">Shiro
Authentication</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/notebook_authorization.html">Notebook
Authorization</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/interpreter_authorization.html">Interpreter
& Data Resource Authorization</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Contibute</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html">Writing
Zeppelin Interpreter</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing
Zeppelin Application</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontribute.html">How to contribute
(code)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontributewebsite.html">How to
contribute (website)</a></li>
+ </ul>
+ </li>
+ </ul>
+ </nav><!--/.navbar-collapse -->
+ </div>
+ </div>
+
+
+ <div class="content">
+
+<!--<div class="hero-unit Angular (backend API)">
+ <h1></h1>
+</div>
+-->
+
+<div class="row">
+ <div class="col-md-12">
+ <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Back-end Angular API in Apache Zeppelin</h1>
+
+<div id="toc"></div>
+
+<h2>Overview</h2>
+
+<p>Angular display system treats output as a view template for <a
href="https://angularjs.org/">AngularJS</a>.
+It compiles templates and displays them inside of Apache Zeppelin. Zeppelin
provides a gateway between your interpreter and your compiled <strong>AngularJS
view</strong> templates.
+Therefore, you can not only update scope variables from your interpreter but
also watch them in the interpreter, which is JVM process.</p>
+
+<h2>Basic Usage</h2>
+
+<h3>Print AngularJS view</h3>
+
+<p>To use angular display system, you should start with <code>%angular</code>.
+<img src="/assets/themes/zeppelin/img/screenshots/display_angular.png"
width="60%" /></p>
+
+<p>Since <code>name</code> is not defined, <code>Hello</code> will display
<code>Hello</code>.</p>
+
+<blockquote>
+<p><strong>Please Note:</strong> Display system is backend independent.</p>
+</blockquote>
+
+<p><br /></p>
+
+<h3>Bind / Unbind Variables</h3>
+
+<p>Through <strong>ZeppelinContext</strong>, you can bind / unbind variables
to <strong>AngularJS view</strong>. Currently, it only works in <strong>Spark
Interpreter ( scala )</strong>.</p>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// bind my 'object' as angular scope
variable 'name' in current notebook.</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularBind</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">,</span>
<span class="nc">Object</span> <span class="n">object</span><span
class="o">)</span>
+
+<span class="c1">// bind my 'object' as angular scope variable
'name' in all notebooks related to current interpreter.</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularBindGlobal</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">,</span>
<span class="nc">Object</span> <span class="n">object</span><span
class="o">)</span>
+
+<span class="c1">// unbind angular scope variable 'name' in current
notebook.</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularUnbind</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">)</span>
+
+<span class="c1">// unbind angular scope variable 'name' in all
notebooks related to current interpreter.</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularUnbindGlobal</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">)</span>
+</code></pre></div>
+<p>Using the above example, let's bind <code>world</code> variable to
<code>name</code>. Then you can see <strong>AngularJs view</strong> is
immediately updated.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_angular1.png"
width="60%" /></p>
+
+<p><br /></p>
+
+<h3>Watch / Unwatch Variables</h3>
+
+<p>Through <strong>ZeppelinContext</strong>, you can watch / unwatch variables
in <strong>AngularJs view</strong>. Currently, it only works in <strong>Spark
Interpreter ( scala )</strong>.</p>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// register for angular scope variable
'name' (notebook)</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularWatch</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">,</span>
<span class="o">(</span><span class="n">before</span><span class="o">,</span>
<span class="n">after</span><span class="o">)</span> <span
class="k">=></span> <span class="o">{</span> <span class="o">...</span>
<span class="o">})</span>
+
+<span class="c1">// unregister watcher for angular variable 'name'
(notebook)</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularUnwatch</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">)</span>
+
+<span class="c1">// register for angular scope variable 'name'
(global)</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularWatchGlobal</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">,</span>
<span class="o">(</span><span class="n">before</span><span class="o">,</span>
<span class="n">after</span><span class="o">)</span> <span
class="k">=></span> <span class="o">{</span> <span class="o">...</span>
<span class="o">})</span>
+
+<span class="c1">// unregister watcher for angular variable 'name'
(global)</span>
+<span class="n">z</span><span class="o">.</span><span
class="n">angularUnwatchGlobal</span><span class="o">(</span><span
class="nc">String</span> <span class="n">name</span><span class="o">)</span>
+</code></pre></div>
+<p>Let's make a button. When it is clicked, the value of <code>run</code>
will be increased 1 by 1.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_angular2.png"
width="60%" /></p>
+
+<p><code>z.angularBind("run", 0)</code> will initialize
<code>run</code> to zero. And then, it will be also applied to <code>run</code>
in <code>z.angularWatch()</code>.
+When the button is clicked, you'll see both <code>run</code> and
<code>numWatched</code> are incremented by 1.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_angular3.png"
width="60%" /></p>
+
+<h2>Let's make it Simpler and more Intuitive</h2>
+
+<p>In this section, we will introduce a simpler and more intuitive way of
using <strong>Angular Display System</strong> in Zeppelin.</p>
+
+<p>Here are some usages.</p>
+
+<h3>Import</h3>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// In notebook scope</span>
+<span class="k">import</span> <span
class="nn">org.apache.zeppelin.display.angular.notebookscope._</span>
+<span class="k">import</span> <span class="nn">AngularElem._</span>
+
+<span class="c1">// In paragraph scope</span>
+<span class="k">import</span> <span
class="nn">org.apache.zeppelin.display.angular.paragraphscope._</span>
+<span class="k">import</span> <span class="nn">AngularElem._</span>
+</code></pre></div>
+<h3>Display Element</h3>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// automatically convert to string and print
with %angular display system directive in front.</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">><</span><span class="n">div</span><span
class="o">>.</span><span class="n">display</span>
+</code></pre></div>
+<h3>Event Handler</h3>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// on click</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">></</span><span class="n">div</span><span
class="o">>.</span><span class="n">onClick</span><span class="o">(()</span>
<span class="k">=></span> <span class="o">{</span>
+ <span class="n">my</span> <span class="n">callback</span> <span
class="n">routine</span>
+<span class="o">}).</span><span class="n">display</span>
+
+<span class="c1">// on change</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">></</span><span class="n">div</span><span
class="o">>.</span><span class="n">onChange</span><span class="o">(()</span>
<span class="k">=></span> <span class="o">{</span>
+ <span class="n">my</span> <span class="n">callback</span> <span
class="n">routine</span>
+<span class="o">}).</span><span class="n">display</span>
+
+<span class="c1">// arbitrary event</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">></</span><span class="n">div</span><span
class="o">>.</span><span class="n">onEvent</span><span
class="o">(</span><span class="s">"ng-click"</span><span
class="o">,</span> <span class="o">()</span> <span class="k">=></span> <span
class="o">{</span>
+ <span class="n">my</span> <span class="n">callback</span> <span
class="n">routine</span>
+<span class="o">}).</span><span class="n">display</span>
+</code></pre></div>
+<h3>Bind Model</h3>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// bind model</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">></</span><span class="n">div</span><span
class="o">>.</span><span class="n">model</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">).</span><span
class="n">display</span>
+
+<span class="c1">// bind model with initial value</span>
+<span class="o"><</span><span class="n">div</span><span
class="o">></</span><span class="n">div</span><span
class="o">>.</span><span class="n">model</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">,</span> <span
class="n">initialValue</span><span class="o">).</span><span
class="n">display</span>
+</code></pre></div>
+<h3>Interact with Model</h3>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// read model</span>
+<span class="nc">AngularModel</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">)()</span>
+
+<span class="c1">// update model</span>
+<span class="nc">AngularModel</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">,</span> <span
class="s">"newValue"</span><span class="o">)</span>
+</code></pre></div>
+<p><br/></p>
+
+<h3>Example: Basic Usage</h3>
+
+<p>Using the above basic usages, you can apply them like below examples.</p>
+
+<h4>Display Elements</h4>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="o"><</span><span class="n">div</span> <span
class="n">style</span><span class="o">=</span><span
class="s">"color:blue"</span><span class="o">></span>
+ <span class="o"><</span><span class="n">h4</span><span
class="o">></span><span class="nc">Hello</span> <span
class="nc">Angular</span> <span class="nc">Display</span> <span
class="nc">System</span><span class="o"></</span><span
class="n">h4</span><span class="o">></span>
+<span class="o"></</span><span class="n">div</span><span
class="o">>.</span><span class="n">display</span>
+</code></pre></div>
+<h4>OnClick Event</h4>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="o"><</span><span class="n">div</span> <span
class="n">class</span><span class="o">=</span><span class="s">"btn
btn-success"</span><span class="o">></span>
+ <span class="nc">Click</span> <span class="n">me</span>
+<span class="o"></</span><span class="n">div</span><span
class="o">>.</span><span class="n">onClick</span><span class="o">{()</span>
<span class="k">=></span>
+ <span class="c1">// callback for button click</span>
+<span class="o">}.</span><span class="n">display</span>
+</code></pre></div>
+<h4>Bind Model</h4>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"> <span class="o"><</span><span class="n">div</span><span
class="o">>{{{{</span><span class="n">myModel</span><span
class="o">}}}}</</span><span class="n">div</span><span
class="o">>.</span><span class="n">model</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">,</span> <span
class="s">"Initial Value"</span><span class="o">).</span><span
class="n">display</span>
+</code></pre></div>
+<h4>Interact With Model</h4>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// read the value</span>
+<span class="nc">AngularModel</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">)()</span>
+
+<span class="c1">// update the value</span>
+<span class="nc">AngularModel</span><span class="o">(</span><span
class="s">"myModel"</span><span class="o">,</span> <span
class="s">"New value"</span><span class="o">)</span>
+</code></pre></div>
+<p><img src="../assets/themes/zeppelin/img/docs-img/basic-usage-angular.png"
width="70%"></p>
+
+<h3>Example: String Converter</h3>
+
+<p>Using below example, you can convert the lowercase string to uppercase.</p>
+<div class="highlight"><pre><code class="scala language-scala"
data-lang="scala"><span class="c1">// clear previously created angular
object.</span>
+<span class="nc">AngularElem</span><span class="o">.</span><span
class="n">disassociate</span>
+
+<span class="k">val</span> <span class="n">button</span> <span
class="k">=</span> <span class="o"><</span><span class="n">div</span> <span
class="n">class</span><span class="o">=</span><span class="s">"btn
btn-success btn-sm"</span><span class="o">></span><span
class="nc">Convert</span><span class="o"></</span><span
class="n">div</span><span class="o">>.</span><span
class="n">onClick</span><span class="o">{()</span> <span class="k">=></span>
+ <span class="k">val</span> <span class="n">inputString</span> <span
class="k">=</span> <span class="nc">AngularModel</span><span
class="o">(</span><span class="s">"input"</span><span
class="o">)().</span><span class="n">toString</span>
+ <span class="nc">AngularModel</span><span class="o">(</span><span
class="s">"title"</span><span class="o">,</span> <span
class="n">inputString</span><span class="o">.</span><span
class="n">toUpperCase</span><span class="o">)</span>
+<span class="o">}</span>
+
+<span class="o"><</span><span class="n">div</span><span
class="o">></span>
+ <span class="o">{</span> <span class="o"><</span><span
class="n">h4</span><span class="o">></span> <span class="o">{{{{</span><span
class="n">title</span><span class="o">}}}}</</span><span
class="n">h4</span><span class="o">>.</span><span
class="n">model</span><span class="o">(</span><span
class="s">"title"</span><span class="o">,</span> <span
class="s">"Please type text to convert uppercase"</span><span
class="o">)</span> <span class="o">}</span>
+ <span class="nc">Your</span> <span class="n">text</span> <span
class="o">{</span> <span class="o"><</span><span class="n">input</span>
<span class="n">type</span><span class="o">=</span><span
class="s">"text"</span><span class="o">></</span><span
class="n">input</span><span class="o">>.</span><span
class="n">model</span><span class="o">(</span><span
class="s">"input"</span><span class="o">,</span> <span
class="s">""</span><span class="o">)</span> <span class="o">}</span>
+ <span class="o">{</span><span class="n">button</span><span class="o">}</span>
+<span class="o"></</span><span class="n">div</span><span
class="o">>.</span><span class="n">display</span>
+</code></pre></div>
+<p><img
src="../assets/themes/zeppelin/img/docs-img/string-converter-angular.gif"
width="70%"></p>
+
+ </div>
+</div>
+
+
+ <hr>
+ <footer>
+ <!-- <p>© 2016 The Apache Software Foundation</p>-->
+ </footer>
+ </div>
+
+
+
+
+ <script type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new
Date();a=s.createElement(o),
+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+ ga('require', 'linkid', 'linkid.js');
+ ga('send', 'pageview');
+
+</script>
+
+
+
+ </body>
+</html>
+
Propchange:
zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html
------------------------------------------------------------------------------
svn:eol-style = native
Added: zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html
URL:
http://svn.apache.org/viewvc/zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html?rev=1751605&view=auto
==============================================================================
--- zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html
(added)
+++ zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html Wed
Jul 6 06:25:29 2016
@@ -0,0 +1,253 @@
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Basic Display System</title>
+ <meta name="description" content="">
+ <meta name="author" content="The Apache Software Foundation">
+
+ <!-- Enable responsive viewport -->
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+ <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <link
href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"
rel="stylesheet">
+
+ <!-- Le styles -->
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/css/bootstrap.css"
rel="stylesheet">
+ <link
href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/style.css?body=1"
rel="stylesheet" type="text/css">
+ <link href="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/css/syntax.css"
rel="stylesheet" type="text/css" media="screen" />
+ <!-- Le fav and touch icons -->
+ <!-- Update these with your own images
+ <link rel="shortcut icon" href="images/favicon.ico">
+ <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+ <link rel="apple-touch-icon" sizes="72x72"
href="images/apple-touch-icon-72x72.png">
+ <link rel="apple-touch-icon" sizes="114x114"
href="images/apple-touch-icon-114x114.png">
+ -->
+
+ <!-- Js -->
+ <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/docs.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script
src="/docs/0.7.0-SNAPSHOT/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.7.0-SNAPSHOT/atom.xml" type="application/atom+xml"
rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.7.0-SNAPSHOT/rss.xml" type="application/rss+xml"
rel="alternate" title="Sitewide RSS Feed">
+ </head>
+
+ <body>
+
+ <div id="menu" class="navbar navbar-inverse navbar-fixed-top"
role="navigation">
+ <div class="container">
+ <div class="navbar-header">
+ <button type="button" class="navbar-toggle" data-toggle="collapse"
data-target=".navbar-collapse">
+ <span class="sr-only">Toggle navigation</span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="navbar-brand" href="/docs/0.7.0-SNAPSHOT">
+ <img src="/assets/themes/zeppelin/img/zeppelin_logo.png"
width="50" alt="I'm zeppelin">
+ <span style="vertical-align:middle">Zeppelin</span>
+ <span
style="vertical-align:baseline"><small>0.7.0-SNAPSHOT</small></span>
+ </a>
+ </div>
+ <nav class="navbar-collapse collapse" role="navigation">
+ <ul class="nav navbar-nav">
+ <li>
+ <a href="#" data-toggle="dropdown" class="dropdown-toggle">Quick
Start <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li><a href="/docs/0.7.0-SNAPSHOT/index.html">What is Apache
Zeppelin ?</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Getting Started</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html">Install</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/explorezeppelinui.html">Explore Zeppelin
UI</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/quickstart/tutorial.html">Tutorial</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Basic Feature Guide</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.7.0-SNAPSHOT/manual/publish.html">Publish
your Paragraph</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/notebookashomepage.html">Customize Zeppelin
Homepage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>More</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant
VM</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/install/upgrade.html">Upgrade Zeppelin
Version</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Interpreter <b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu">
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreters.html">Overview</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Usage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/interpreterinstallation.html">Interpreter
Installation</a></li>
+ <!--<li><a
href="/docs/0.7.0-SNAPSHOT/manual/dynamicinterpreterload.html">Dynamic
Interpreter Loading</a></li>-->
+ <li><a
href="/docs/0.7.0-SNAPSHOT/manual/dependencymanagement.html">Interpreter
Dependency Management</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Available
Interpreters</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/flink.html">Flink</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/geode.html">Geode</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hbase.html">HBase</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hdfs.html">HDFS</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/hive.html">Hive</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/ignite.html">Ignite</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/jdbc.html">JDBC</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/lens.html">Lens</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/livy.html">Livy</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/markdown.html">Markdown</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/python.html">Python</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/postgresql.html">Postgresql,
HAWQ</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/r.html">R</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/scalding.html">Scalding</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/pleasecontribute.html">Shell</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/interpreter/spark.html">Spark</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">Display System <b class="caret"></b></a>
+ <ul class="dropdown-menu">
+ <li class="title"><span><b>Basic Display System</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html#table">Table</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Angular API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/back-end-angular.html">Angular
(backend API)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/displaysystem/front-end-angular.html">Angular
(frontend API)</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#" data-toggle="dropdown"
class="dropdown-toggle">More<b class="caret"></b></a>
+ <ul class="dropdown-menu scrollable-menu" style="right: 0; left:
auto;">
+ <li class="title"><span><b>Notebook Storage</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-local-git-repository">Git
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-s3">S3
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#notebook-storage-in-azure">Azure
Storage</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/storage/storage.html#storage-in-zeppelinhub">ZeppelinHub
Storage</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>REST API</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-interpreter.html">Interpreter
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-configuration.html">Configuration
API</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/rest-api/rest-credential.html">Credential
API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/authentication.html">Authentication for
NGINX</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/shiroauthentication.html">Shiro
Authentication</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/notebook_authorization.html">Notebook
Authorization</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/security/interpreter_authorization.html">Interpreter
& Data Resource Authorization</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Contibute</b><span></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelininterpreter.html">Writing
Zeppelin Interpreter</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing
Zeppelin Application</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontribute.html">How to contribute
(code)</a></li>
+ <li><a
href="/docs/0.7.0-SNAPSHOT/development/howtocontributewebsite.html">How to
contribute (website)</a></li>
+ </ul>
+ </li>
+ </ul>
+ </nav><!--/.navbar-collapse -->
+ </div>
+ </div>
+
+
+ <div class="content">
+
+<!--<div class="hero-unit Basic Display System">
+ <h1></h1>
+</div>
+-->
+
+<div class="row">
+ <div class="col-md-12">
+ <!--
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+-->
+
+<h1>Basic Display System in Apache Zeppelin</h1>
+
+<div id="toc"></div>
+
+<h2>Text</h2>
+
+<p>By default, Apache Zeppelin prints interpreter responce as a plain text
using <code>text</code> display system.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_text.png" /></p>
+
+<p>You can explicitly say you're using <code>text</code> display
system.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_text1.png" /></p>
+
+<h2>Html</h2>
+
+<p>With <code>%html</code> directive, Zeppelin treats your output as HTML</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_html.png" /></p>
+
+<h2>Table</h2>
+
+<p>If you have data that row seprated by '\n' (newline) and column
separated by '\t' (tab) with first row as header row, for example</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_table.png" /></p>
+
+<p>You can simply use <code>%table</code> display system to leverage
Zeppelin's built in visualization.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_table1.png" /></p>
+
+<p>If table contents start with <code>%html</code>, it is interpreted as an
HTML.</p>
+
+<p><img src="/assets/themes/zeppelin/img/screenshots/display_table_html.png"
/></p>
+
+<blockquote>
+<p><strong>Note :</strong> Display system is backend independent.</p>
+</blockquote>
+
+ </div>
+</div>
+
+
+ <hr>
+ <footer>
+ <!-- <p>© 2016 The Apache Software Foundation</p>-->
+ </footer>
+ </div>
+
+
+
+
+ <script type="text/javascript">
+ (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new
Date();a=s.createElement(o),
+
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+ })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+ ga('create', 'UA-45176241-5', 'zeppelin.apache.org');
+ ga('require', 'linkid', 'linkid.js');
+ ga('send', 'pageview');
+
+</script>
+
+
+
+ </body>
+</html>
+
Propchange:
zeppelin/site/docs/0.7.0-SNAPSHOT/displaysystem/basicdisplaysystem.html
------------------------------------------------------------------------------
svn:eol-style = native