You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by mi...@apache.org on 2016/10/17 04:13:37 UTC
svn commit: r1765205 [7/21] - in /zeppelin/site: ./ contribution/
contribution/zeppelinweb/ docs/0.6.2/ docs/0.6.2/assets/
docs/0.6.2/assets/themes/ docs/0.6.2/assets/themes/zeppelin/
docs/0.6.2/assets/themes/zeppelin/bootstrap/ docs/0.6.2/assets/theme...
Added: zeppelin/site/docs/0.6.2/displaysystem/back-end-angular.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.6.2/displaysystem/back-end-angular.html?rev=1765205&view=auto
==============================================================================
--- zeppelin/site/docs/0.6.2/displaysystem/back-end-angular.html (added)
+++ zeppelin/site/docs/0.6.2/displaysystem/back-end-angular.html Mon Oct 17 04:13:33 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.6.2/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+ <link href="/docs/0.6.2/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+ <link href="/docs/0.6.2/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.6.2/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/docs.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.6.2/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.6.2/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.6.2">
+ <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.6.2</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.6.2/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.6.2/install/install.html">Install</a></li>
+ <li><a href="/docs/0.6.2/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a href="/docs/0.6.2/quickstart/explorezeppelinui.html">Explore Zeppelin UI</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.6.2/manual/publish.html">Publish your Paragraph</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/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.6.2/manual/interpreterinstallation.html">Interpreter Installation</a></li>
+ <!--<li><a href="/docs/0.6.2/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>-->
+ <li><a href="/docs/0.6.2/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.6.2/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a href="/docs/0.6.2/interpreter/bigquery.html">BigQuery</a></li>
+ <li><a href="/docs/0.6.2/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a href="/docs/0.6.2/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a href="/docs/0.6.2/interpreter/flink.html">Flink</a></li>
+ <li><a href="/docs/0.6.2/interpreter/geode.html">Geode</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hbase.html">HBase</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hdfs.html">HDFS</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hive.html">Hive</a></li>
+ <li><a href="/docs/0.6.2/interpreter/ignite.html">Ignite</a></li>
+ <li><a href="/docs/0.6.2/interpreter/jdbc.html">JDBC</a></li>
+ <li><a href="/docs/0.6.2/interpreter/lens.html">Lens</a></li>
+ <li><a href="/docs/0.6.2/interpreter/livy.html">Livy</a></li>
+ <li><a href="/docs/0.6.2/interpreter/markdown.html">Markdown</a></li>
+ <li><a href="/docs/0.6.2/interpreter/python.html">Python</a></li>
+ <li><a href="/docs/0.6.2/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+ <li><a href="/docs/0.6.2/interpreter/r.html">R</a></li>
+ <li><a href="/docs/0.6.2/interpreter/scalding.html">Scalding</a></li>
+ <li><a href="/docs/0.6.2/pleasecontribute.html">Shell</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a href="/docs/0.6.2/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/back-end-angular.html">Angular (backend API)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/rest-api/rest-interpreter.html">Interpreter API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-configuration.html">Configuration API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a href="/docs/0.6.2/security/authentication.html">Authentication for NGINX</a></li>
+ <li><a href="/docs/0.6.2/security/shiroauthentication.html">Shiro Authentication</a></li>
+ <li><a href="/docs/0.6.2/security/notebook_authorization.html">Notebook Authorization</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/development/writingzeppelininterpreter.html">Writing Zeppelin Interpreter</a></li>
+ <li><a href="/docs/0.6.2/development/howtocontribute.html">How to contribute (code)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/back-end-angular.html
------------------------------------------------------------------------------
svn:eol-style = native
Added: zeppelin/site/docs/0.6.2/displaysystem/basicdisplaysystem.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.6.2/displaysystem/basicdisplaysystem.html?rev=1765205&view=auto
==============================================================================
--- zeppelin/site/docs/0.6.2/displaysystem/basicdisplaysystem.html (added)
+++ zeppelin/site/docs/0.6.2/displaysystem/basicdisplaysystem.html Mon Oct 17 04:13:33 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.6.2/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+ <link href="/docs/0.6.2/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+ <link href="/docs/0.6.2/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.6.2/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/docs.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.6.2/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.6.2/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.6.2">
+ <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.6.2</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.6.2/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.6.2/install/install.html">Install</a></li>
+ <li><a href="/docs/0.6.2/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a href="/docs/0.6.2/quickstart/explorezeppelinui.html">Explore Zeppelin UI</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.6.2/manual/publish.html">Publish your Paragraph</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/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.6.2/manual/interpreterinstallation.html">Interpreter Installation</a></li>
+ <!--<li><a href="/docs/0.6.2/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>-->
+ <li><a href="/docs/0.6.2/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.6.2/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a href="/docs/0.6.2/interpreter/bigquery.html">BigQuery</a></li>
+ <li><a href="/docs/0.6.2/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a href="/docs/0.6.2/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a href="/docs/0.6.2/interpreter/flink.html">Flink</a></li>
+ <li><a href="/docs/0.6.2/interpreter/geode.html">Geode</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hbase.html">HBase</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hdfs.html">HDFS</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hive.html">Hive</a></li>
+ <li><a href="/docs/0.6.2/interpreter/ignite.html">Ignite</a></li>
+ <li><a href="/docs/0.6.2/interpreter/jdbc.html">JDBC</a></li>
+ <li><a href="/docs/0.6.2/interpreter/lens.html">Lens</a></li>
+ <li><a href="/docs/0.6.2/interpreter/livy.html">Livy</a></li>
+ <li><a href="/docs/0.6.2/interpreter/markdown.html">Markdown</a></li>
+ <li><a href="/docs/0.6.2/interpreter/python.html">Python</a></li>
+ <li><a href="/docs/0.6.2/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+ <li><a href="/docs/0.6.2/interpreter/r.html">R</a></li>
+ <li><a href="/docs/0.6.2/interpreter/scalding.html">Scalding</a></li>
+ <li><a href="/docs/0.6.2/pleasecontribute.html">Shell</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a href="/docs/0.6.2/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/back-end-angular.html">Angular (backend API)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/rest-api/rest-interpreter.html">Interpreter API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-configuration.html">Configuration API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a href="/docs/0.6.2/security/authentication.html">Authentication for NGINX</a></li>
+ <li><a href="/docs/0.6.2/security/shiroauthentication.html">Shiro Authentication</a></li>
+ <li><a href="/docs/0.6.2/security/notebook_authorization.html">Notebook Authorization</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/development/writingzeppelininterpreter.html">Writing Zeppelin Interpreter</a></li>
+ <li><a href="/docs/0.6.2/development/howtocontribute.html">How to contribute (code)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/basicdisplaysystem.html
------------------------------------------------------------------------------
svn:eol-style = native
Added: zeppelin/site/docs/0.6.2/displaysystem/front-end-angular.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.6.2/displaysystem/front-end-angular.html?rev=1765205&view=auto
==============================================================================
--- zeppelin/site/docs/0.6.2/displaysystem/front-end-angular.html (added)
+++ zeppelin/site/docs/0.6.2/displaysystem/front-end-angular.html Mon Oct 17 04:13:33 2016
@@ -0,0 +1,336 @@
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Angular (frontend API)</title>
+ <meta name="description" content="Angular (frontend 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.6.2/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+ <link href="/docs/0.6.2/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+ <link href="/docs/0.6.2/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.6.2/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/docs.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.6.2/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.6.2/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.6.2">
+ <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.6.2</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.6.2/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.6.2/install/install.html">Install</a></li>
+ <li><a href="/docs/0.6.2/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a href="/docs/0.6.2/quickstart/explorezeppelinui.html">Explore Zeppelin UI</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.6.2/manual/publish.html">Publish your Paragraph</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/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.6.2/manual/interpreterinstallation.html">Interpreter Installation</a></li>
+ <!--<li><a href="/docs/0.6.2/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>-->
+ <li><a href="/docs/0.6.2/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.6.2/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a href="/docs/0.6.2/interpreter/bigquery.html">BigQuery</a></li>
+ <li><a href="/docs/0.6.2/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a href="/docs/0.6.2/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a href="/docs/0.6.2/interpreter/flink.html">Flink</a></li>
+ <li><a href="/docs/0.6.2/interpreter/geode.html">Geode</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hbase.html">HBase</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hdfs.html">HDFS</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hive.html">Hive</a></li>
+ <li><a href="/docs/0.6.2/interpreter/ignite.html">Ignite</a></li>
+ <li><a href="/docs/0.6.2/interpreter/jdbc.html">JDBC</a></li>
+ <li><a href="/docs/0.6.2/interpreter/lens.html">Lens</a></li>
+ <li><a href="/docs/0.6.2/interpreter/livy.html">Livy</a></li>
+ <li><a href="/docs/0.6.2/interpreter/markdown.html">Markdown</a></li>
+ <li><a href="/docs/0.6.2/interpreter/python.html">Python</a></li>
+ <li><a href="/docs/0.6.2/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+ <li><a href="/docs/0.6.2/interpreter/r.html">R</a></li>
+ <li><a href="/docs/0.6.2/interpreter/scalding.html">Scalding</a></li>
+ <li><a href="/docs/0.6.2/pleasecontribute.html">Shell</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a href="/docs/0.6.2/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/back-end-angular.html">Angular (backend API)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/rest-api/rest-interpreter.html">Interpreter API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-configuration.html">Configuration API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a href="/docs/0.6.2/security/authentication.html">Authentication for NGINX</a></li>
+ <li><a href="/docs/0.6.2/security/shiroauthentication.html">Shiro Authentication</a></li>
+ <li><a href="/docs/0.6.2/security/notebook_authorization.html">Notebook Authorization</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/development/writingzeppelininterpreter.html">Writing Zeppelin Interpreter</a></li>
+ <li><a href="/docs/0.6.2/development/howtocontribute.html">How to contribute (code)</a></li>
+ <li><a href="/docs/0.6.2/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 (frontend 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>Front-end Angular API in Apache Zeppelin</h1>
+
+<div id="toc"></div>
+
+<h2>Basic Usage</h2>
+
+<p>In addition to the <a href="./back-end-angular.html">back-end API</a> to handle Angular objects binding, Apache Zeppelin also exposes a simple AngularJS <code><strong>z</strong></code> object on the front-end side to expose the same capabilities.
+This <code><strong>z</strong></code> object is accessible in the Angular isolated scope for each paragraph.</p>
+
+<h3>Bind / Unbind Variables</h3>
+
+<p>Through the <strong><code>z</code></strong>, you can bind / unbind variables to <strong>AngularJS view</strong>.
+Bind a value to an angular object and a <strong>mandatory</strong> target paragraph:</p>
+<div class="highlight"><pre><code class="html language-html" data-lang="html">%angular
+
+<span class="nt"><form</span> <span class="na">class=</span><span class="s">"form-inline"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"form-group"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">for=</span><span class="s">"superheroId"</span><span class="nt">></span>Super Hero: <span class="nt"></label></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">class=</span><span class="s">"form-control"</span> <span class="na">id=</span><span class="s">"superheroId"</span> <span class="na">placeholder=</span><span class="s">"Superhero name ..."</span> <span class="na">ng-model=</span><span class="s">"superhero"</span><span class="nt">></input></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"btn btn-primary"</span> <span class="na">ng-click=</span><span class="s">"z.angularBind('superhero',superhero,'20160222-232336_1472609686')"</span><span class="nt">></span> Bind<span class="nt"></button></span>
+<span class="nt"></form></span>
+</code></pre></div>
+<p><img src="../assets/themes/zeppelin/img/screenshots/z_angularBind.gif" /></p>
+
+<hr/>
+
+<p>Unbind/remove a value from angular object and a <strong>mandatory</strong> target paragraph:</p>
+<div class="highlight"><pre><code class="html language-html" data-lang="html">%angular
+
+<span class="nt"><form</span> <span class="na">class=</span><span class="s">"form-inline"</span><span class="nt">></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"btn btn-primary"</span> <span class="na">ng-click=</span><span class="s">"z.angularUnbind('superhero','20160222-232336_1472609686')"</span><span class="nt">></span> UnBind<span class="nt"></button></span>
+<span class="nt"></form></span>
+</code></pre></div>
+<p><img src="../assets/themes/zeppelin/img/screenshots/z_angularUnbind.gif" /></p>
+
+<p>The signature for the <strong><code>z.angularBind() / z.angularUnbind()</code></strong> functions are:</p>
+<div class="highlight"><pre><code class="javascript language-javascript" data-lang="javascript"><span class="c1">// Bind</span>
+<span class="nx">z</span><span class="p">.</span><span class="nx">angularBind</span><span class="p">(</span><span class="nx">angularObjectName</span><span class="p">,</span> <span class="nx">angularObjectValue</span><span class="p">,</span> <span class="nx">paragraphId</span><span class="p">);</span>
+
+<span class="c1">// Unbind</span>
+<span class="nx">z</span><span class="p">.</span><span class="nx">angularUnbind</span><span class="p">(</span><span class="nx">angularObjectName</span><span class="p">,</span> <span class="nx">angularObjectValue</span><span class="p">,</span> <span class="nx">paragraphId</span><span class="p">);</span>
+</code></pre></div>
+<p>All the parameters are mandatory.</p>
+
+<p><br /></p>
+
+<h3>Run Paragraph</h3>
+
+<p>You can also trigger paragraph execution by calling <strong><code>z.runParagraph()</code></strong> function passing the appropriate paragraphId: </p>
+<div class="highlight"><pre><code class="html language-html" data-lang="html">%angular
+
+<span class="nt"><form</span> <span class="na">class=</span><span class="s">"form-inline"</span><span class="nt">></span>
+ <span class="nt"><div</span> <span class="na">class=</span><span class="s">"form-group"</span><span class="nt">></span>
+ <span class="nt"><label</span> <span class="na">for=</span><span class="s">"paragraphId"</span><span class="nt">></span>Paragraph Id: <span class="nt"></label></span>
+ <span class="nt"><input</span> <span class="na">type=</span><span class="s">"text"</span> <span class="na">class=</span><span class="s">"form-control"</span> <span class="na">id=</span><span class="s">"paragraphId"</span> <span class="na">placeholder=</span><span class="s">"Paragraph Id ..."</span> <span class="na">ng-model=</span><span class="s">"paragraph"</span><span class="nt">></input></span>
+ <span class="nt"></div></span>
+ <span class="nt"><button</span> <span class="na">type=</span><span class="s">"submit"</span> <span class="na">class=</span><span class="s">"btn btn-primary"</span> <span class="na">ng-click=</span><span class="s">"z.runParagraph(paragraph)"</span><span class="nt">></span> Run Paragraph<span class="nt"></button></span>
+<span class="nt"></form></span>
+</code></pre></div>
+<p><img src="../assets/themes/zeppelin/img/screenshots/z_runParagraph.gif" /></p>
+
+<p><br /></p>
+
+<h2>Overriding dynamic form with Angular Object</h2>
+
+<p>The front-end Angular Interaction API has been designed to offer richer form capabilities and variable binding. With the existing <strong>Dynamic Form</strong> system you can already create input text, select and checkbox forms but the choice is rather limited and the look & feel cannot be changed.</p>
+
+<p>The idea is to create a custom form using plain HTML/AngularJS code and bind actions on this form to push/remove Angular variables to targeted paragraphs using this new API. </p>
+
+<p>Consequently if you use the <strong>Dynamic Form</strong> syntax in a paragraph and there is a bound Angular object having the same name as the <code>${formName}</code>, the Angular object will have higher priority and the <strong>Dynamic Form</strong> will not be displayed. Example: </p>
+
+<p><img src="../assets/themes/zeppelin/img/screenshots/z_angularJs_overriding_dynamic_form.gif" /></p>
+
+<p><br /></p>
+
+<h2>Feature matrix comparison</h2>
+
+<p>How does the front-end AngularJS API compares to the <a href="./back-end-angular.html">back-end API</a> ? Below is a comparison matrix for both APIs:</p>
+
+<table class="table-configuration">
+ <thead>
+ <tr>
+ <th>Actions</th>
+ <th>Front-end API</th>
+ <th>Back-end API</th>
+ </tr>
+ </thead>
+ <tr>
+ <td>Initiate binding</td>
+ <td>z.angularbind(var, initialValue, paragraphId)</td>
+ <td>z.angularBind(var, initialValue)</td>
+ </tr>
+ <tr>
+ <td>Update value</td>
+ <td>same to ordinary angularjs scope variable, or z.angularbind(var, newValue, paragraphId)</td>
+ <td>z.angularBind(var, newValue)</td>
+ </tr>
+ <tr>
+ <td>Watching value</td>
+ <td>same to ordinary angularjs scope variable</td>
+ <td>z.angularWatch(var, (oldVal, newVal) => ...)</td>
+ </tr>
+ <tr>
+ <td>Destroy binding</td>
+ <td>z.angularUnbind(var, paragraphId)</td>
+ <td>z.angularUnbind(var)</td>
+ </tr>
+ <tr>
+ <td>Executing Paragraph</td>
+ <td>z.runParagraph(paragraphId)</td>
+ <td>z.run(paragraphId)</td>
+ </tr>
+ <tbody>
+ <tbody>
+</table>
+
+<p>Both APIs are pretty similar, except for value watching where it is done naturally by AngularJS internals on the front-end and by user custom watcher functions in the back-end.</p>
+
+<p>There is also a slight difference in term of scope. Front-end API limits the Angular object binding to a paragraph scope whereas back-end API allows you to bind an Angular object at the global or note scope. This restriction has been designed purposely to avoid Angular object leaks and scope pollution.</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.6.2/displaysystem/front-end-angular.html
------------------------------------------------------------------------------
svn:eol-style = native
Added: zeppelin/site/docs/0.6.2/index.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.6.2/index.html?rev=1765205&view=auto
==============================================================================
--- zeppelin/site/docs/0.6.2/index.html (added)
+++ zeppelin/site/docs/0.6.2/index.html Mon Oct 17 04:13:33 2016
@@ -0,0 +1,422 @@
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Overview</title>
+
+ <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.6.2/assets/themes/zeppelin/bootstrap/css/bootstrap.css" rel="stylesheet">
+ <link href="/docs/0.6.2/assets/themes/zeppelin/css/style.css?body=1" rel="stylesheet" type="text/css">
+ <link href="/docs/0.6.2/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.6.2/assets/themes/zeppelin/bootstrap/js/bootstrap.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/docs.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/anchor.min.js"></script>
+ <script src="/docs/0.6.2/assets/themes/zeppelin/js/toc.js"></script>
+
+ <!-- atom & rss feed -->
+ <link href="/docs/0.6.2/atom.xml" type="application/atom+xml" rel="alternate" title="Sitewide ATOM Feed">
+ <link href="/docs/0.6.2/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.6.2">
+ <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.6.2</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.6.2/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.6.2/install/install.html">Install</a></li>
+ <li><a href="/docs/0.6.2/install/install.html#apache-zeppelin-configuration">Configuration</a></li>
+ <li><a href="/docs/0.6.2/quickstart/explorezeppelinui.html">Explore Zeppelin UI</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/manual/dynamicform.html">Dynamic Form</a></li>
+ <li><a href="/docs/0.6.2/manual/publish.html">Publish your Paragraph</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/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.6.2/manual/interpreterinstallation.html">Interpreter Installation</a></li>
+ <!--<li><a href="/docs/0.6.2/manual/dynamicinterpreterload.html">Dynamic Interpreter Loading</a></li>-->
+ <li><a href="/docs/0.6.2/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.6.2/interpreter/alluxio.html">Alluxio</a></li>
+ <li><a href="/docs/0.6.2/interpreter/bigquery.html">BigQuery</a></li>
+ <li><a href="/docs/0.6.2/interpreter/cassandra.html">Cassandra</a></li>
+ <li><a href="/docs/0.6.2/interpreter/elasticsearch.html">Elasticsearch</a></li>
+ <li><a href="/docs/0.6.2/interpreter/flink.html">Flink</a></li>
+ <li><a href="/docs/0.6.2/interpreter/geode.html">Geode</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hbase.html">HBase</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hdfs.html">HDFS</a></li>
+ <li><a href="/docs/0.6.2/interpreter/hive.html">Hive</a></li>
+ <li><a href="/docs/0.6.2/interpreter/ignite.html">Ignite</a></li>
+ <li><a href="/docs/0.6.2/interpreter/jdbc.html">JDBC</a></li>
+ <li><a href="/docs/0.6.2/interpreter/lens.html">Lens</a></li>
+ <li><a href="/docs/0.6.2/interpreter/livy.html">Livy</a></li>
+ <li><a href="/docs/0.6.2/interpreter/markdown.html">Markdown</a></li>
+ <li><a href="/docs/0.6.2/interpreter/python.html">Python</a></li>
+ <li><a href="/docs/0.6.2/interpreter/postgresql.html">Postgresql, HAWQ</a></li>
+ <li><a href="/docs/0.6.2/interpreter/r.html">R</a></li>
+ <li><a href="/docs/0.6.2/interpreter/scalding.html">Scalding</a></li>
+ <li><a href="/docs/0.6.2/pleasecontribute.html">Shell</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/basicdisplaysystem.html#text">Text</a></li>
+ <li><a href="/docs/0.6.2/displaysystem/basicdisplaysystem.html#html">Html</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/displaysystem/back-end-angular.html">Angular (backend API)</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+ <li><a href="/docs/0.6.2/storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/rest-api/rest-interpreter.html">Interpreter API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-notebook.html">Notebook API</a></li>
+ <li><a href="/docs/0.6.2/rest-api/rest-configuration.html">Configuration API</a></li>
+ <li role="separator" class="divider"></li>
+ <li class="title"><span><b>Security</b><span></li>
+ <li><a href="/docs/0.6.2/security/authentication.html">Authentication for NGINX</a></li>
+ <li><a href="/docs/0.6.2/security/shiroauthentication.html">Shiro Authentication</a></li>
+ <li><a href="/docs/0.6.2/security/notebook_authorization.html">Notebook Authorization</a></li>
+ <li><a href="/docs/0.6.2/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.6.2/development/writingzeppelininterpreter.html">Writing Zeppelin Interpreter</a></li>
+ <li><a href="/docs/0.6.2/development/howtocontribute.html">How to contribute (code)</a></li>
+ <li><a href="/docs/0.6.2/development/howtocontributewebsite.html">How to contribute (website)</a></li>
+ </ul>
+ </li>
+ </ul>
+ </nav><!--/.navbar-collapse -->
+ </div>
+ </div>
+
+
+
+ <div class="content">
+
+<!--<div class="hero-unit Overview">
+ <h1> <small>Less Development, More analysis!</small></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.
+-->
+
+<p><br />
+<div class="row">
+ <div class="col-md-6" style="padding-right:0">
+ <h1 style="color:#4c555a">Multi-purpose Notebook</h1>
+ <p class="index-header">
+ The Notebook is the place for all your needs
+ </p>
+ <ul style="list-style-type: none;padding-left:10px;" >
+ <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-import" style="margin-right:10px"></span> Data Ingestion</li>
+ <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-eye-open" style="margin-right:10px"></span> Data Discovery</li>
+ <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-wrench" style="margin-right:10px"></span> Data Analytics</li>
+ <li style="font-size:18px; margin: 5px;"><span class="glyphicon glyphicon-dashboard" style="margin-right:10px"></span> Data Visualization & Collaboration</li>
+ </ul>
+ </div>
+ <div class="col-md-6" style="padding:0">
+ <img class="img-responsive" style="border: 1px solid #ecf0f1;" src="./assets/themes/zeppelin/img/notebook.png" />
+ </div>
+</div></p>
+
+<p><br /></p>
+
+<h2>Multiple Language Backend</h2>
+
+<p><a href="./manual/interpreters.html">Apache Zeppelin interpreter</a> concept allows any language/data-processing-backend to be plugged into Zeppelin.
+Currently Apache Zeppelin supports many interpreters such as Apache Spark, Python, JDBC, Markdown and Shell.</p>
+
+<p><img class="img-responsive" width="500px" style="margin:0 auto; padding: 26px;" src="./assets/themes/zeppelin/img/available_interpreters.png" /></p>
+
+<p>Adding new language-backend is really simple. Learn <a href="./development/writingzeppelininterpreter.html#make-your-own-interpreter">how to create your own interpreter</a>.</p>
+
+<h4>Apache Spark integration</h4>
+
+<p>Especially, Apache Zeppelin provides built-in <a href="http://spark.apache.org/">Apache Spark</a> integration. You don't need to build a separate module, plugin or library for it.</p>
+
+<p><img class="img-responsive" src="./assets/themes/zeppelin/img/spark_logo.jpg" width="140px" /></p>
+
+<p>Apache Zeppelin with Spark integration provides</p>
+
+<ul>
+<li>Automatic SparkContext and SQLContext injection</li>
+<li>Runtime jar dependency loading from local filesystem or maven repository. Learn more about <a href="./interpreter/spark.html#dependencyloading">dependency loader</a>.</li>
+<li>Canceling job and displaying its progress</li>
+</ul>
+
+<p>For the further information about Apache Spark in Apache Zeppelin, please see <a href="./interpreter/spark.html">Spark interpreter for Apache Zeppelin</a>.</p>
+
+<p><br /></p>
+
+<h2>Data visualization</h2>
+
+<p>Some basic charts are already included in Apache Zeppelin. Visualizations are not limited to SparkSQL query, any output from any language backend can be recognized and visualized.</p>
+
+<div class="row">
+ <div class="col-md-6">
+ <img class="img-responsive" src="./assets/themes/zeppelin/img/graph1.png" />
+ </div>
+ <div class="col-md-6">
+ <img class="img-responsive" src="./assets/themes/zeppelin/img/graph2.png" />
+ </div>
+</div>
+
+<h3>Pivot chart</h3>
+
+<p>Apache Zeppelin aggregates values and displays them in pivot chart with simple drag and drop. You can easily create chart with multiple aggregated values including sum, count, average, min, max.</p>
+
+<div class="row">
+ <div class="col-md-12">
+ <img class="img-responsive" style="margin: 16px auto;" src="./assets/themes/zeppelin/img/screenshots/pivot.png" width="480px" />
+ </div>
+</div>
+
+<p>Learn more about <a href="#display-system">display systems</a> in Apache Zeppelin.</p>
+
+<p><br /></p>
+
+<h2>Dynamic forms</h2>
+
+<p>Apache Zeppelin can dynamically create some input forms in your notebook.
+<div class="row">
+ <div class="col-md-12">
+ <img class="img-responsive" style="margin: 16px auto;" src="./assets/themes/zeppelin/img/screenshots/dynamicform.png" />
+ </div>
+</div>
+Learn more about <a href="./manual/dynamicform.html">Dynamic Forms</a>.</p>
+
+<p><br /></p>
+
+<h2>Collaborate by sharing your Notebook & Paragraph</h2>
+
+<p>Your notebook URL can be shared among collaborators. Then Apache Zeppelin will broadcast any changes in realtime, just like the collaboration in Google docs.</p>
+
+<div class="row">
+ <div class="col-md-12">
+ <img class="img-responsive" style="margin: 20px auto" src="./assets/themes/zeppelin/img/screenshots/publish.png" width="650px"/>
+ </div>
+</div>
+
+<p>Apache Zeppelin provides an URL to display the result only, that page does not include any menus and buttons inside of notebooks.
+You can easily embed it as an iframe inside of your website in this way.
+If you want to learn more about this feature, please visit <a href="./manual/publish.html">this page</a>.</p>
+
+<p><br /></p>
+
+<h2>100% Opensource</h2>
+
+<p><img class="img-responsive" style="margin:0 auto; padding: 15px;" src="./assets/themes/zeppelin/img/asf_logo.png" width="250px"/></p>
+
+<p>Apache Zeppelin is Apache2 Licensed software. Please check out the <a href="http://git.apache.org/zeppelin.git">source repository</a> and <a href="./development/howtocontribute.html">how to contribute</a>.
+Apache Zeppelin has a very active development community.
+Join to our <a href="https://zeppelin.apache.org/community.html">Mailing list</a> and report issues on <a href="https://issues.apache.org/jira/browse/ZEPPELIN">Jira Issue tracker</a>.</p>
+
+<h2>What is the next ?</h2>
+
+<h4>Quick Start</h4>
+
+<ul>
+<li>Getting Started
+
+<ul>
+<li><a href="./install/install.html">Quick Start</a> for basic instructions on installing Apache Zeppelin</li>
+<li><a href="./install/install.html#apache-zeppelin-configuration">Configuration</a> lists for Apache Zeppelin</li>
+<li><a href="./quickstart/explorezeppelinui.html">Explore Apache Zeppelin UI</a>: basic components of Apache Zeppelin home</li>
+<li><a href="./quickstart/tutorial.html">Tutorial</a>: a short walk-through tutorial that uses Apache Spark backend</li>
+</ul></li>
+<li>Basic Feature Guide
+
+<ul>
+<li><a href="./manual/dynamicform.html">Dynamic Form</a>: a step by step guide for creating dynamic forms</li>
+<li><a href="./manual/publish.html">Publish your Paragraph</a> results into your external website</li>
+<li><a href="./manual/notebookashomepage.html">Customize Zeppelin Homepage</a> with one of your notebooks</li>
+</ul></li>
+<li>More
+
+<ul>
+<li><a href="./install/virtual_machine.html">Apache Zeppelin on Vagrant VM</a>: a guide for installing Apache Zeppelin on Vagrant virtual machine</li>
+<li><a href="./install/upgrade.html">Upgrade Apache Zeppelin Version</a>: a manual procedure of upgrading Apache Zeppelin version</li>
+</ul></li>
+</ul>
+
+<h4>Interpreter</h4>
+
+<ul>
+<li><a href="./manual/interpreters.html">Interpreters in Apache Zeppelin</a>: what is interpreter group? how can you set interpreters in Apache Zeppelin?</li>
+<li>Usage
+
+<ul>
+<li><a href="./manual/interpreterinstallation.html">Interpreter Installation</a>: Install not only community managed interpreters but also 3rd party interpreters</li>
+<li><a href="./manual/dependencymanagement.html">Interpreter Dependency Management</a> when you include external libraries to interpreter</li>
+</ul></li>
+<li>Available Interpreters: currently, about 20 interpreters are available in Apache Zeppelin.</li>
+</ul>
+
+<h4>Display System</h4>
+
+<ul>
+<li>Basic Display System: <a href="./displaysystem/basicdisplaysystem.html#text">Text</a>, <a href="./displaysystem/basicdisplaysystem.html#html">HTML</a>, <a href="./displaysystem/basicdisplaysystem.html#table">Table</a> is available</li>
+<li>Angular API: a description about avilable backend and frontend AngularJS API with examples
+
+<ul>
+<li><a href="./displaysystem/back-end-angular.html">Angular (backend API)</a></li>
+<li><a href="./displaysystem/front-end-angular.html">Angular (frontend API)</a></li>
+</ul></li>
+</ul>
+
+<h4>More</h4>
+
+<ul>
+<li>Notebook Storage: a guide about saving notebooks to external storage
+
+<ul>
+<li><a href="./storage/storage.html#notebook-storage-in-local-git-repository">Git Storage</a></li>
+<li><a href="./storage/storage.html#notebook-storage-in-s3">S3 Storage</a></li>
+<li><a href="./storage/storage.html#notebook-storage-in-azure">Azure Storage</a></li>
+<li><a href="./storage/storage.html#storage-in-zeppelinhub">ZeppelinHub Storage</a></li>
+</ul></li>
+<li>REST API: available REST API list in Apache Zeppelin
+
+<ul>
+<li><a href="./rest-api/rest-interpreter.html">Interpreter API</a></li>
+<li><a href="./rest-api/rest-notebook.html">Notebook API</a></li>
+<li><a href="./rest-api/rest-configuration.html">Configuration API</a></li>
+</ul></li>
+<li>Security: available security support in Apache Zeppelin
+
+<ul>
+<li><a href="./security/authentication.html">Authentication for NGINX</a></li>
+<li><a href="./security/shiroauthentication.html">Shiro Authentication</a></li>
+<li><a href="./security/notebook_authorization.html">Notebook Authorization</a></li>
+<li><a href="./security/interpreter_authorization.html">Interpreter & Data Resource Authorization</a></li>
+</ul></li>
+<li>Contribute
+
+<ul>
+<li><a href="./development/writingzeppelininterpreter.html">Writing a new Interpreter</a></li>
+<li><a href="./development/howtocontribute.html">How to contribute (code)</a></li>
+<li><a href="./development/howtocontributewebsite.html">How to contribute (documentation website)</a></li>
+</ul></li>
+</ul>
+
+<h4>External Resources</h4>
+
+<ul>
+<li><a href="https://zeppelin.apache.org/community.html">Mailing List</a></li>
+<li><a href="https://cwiki.apache.org/confluence/display/ZEPPELIN/Zeppelin+Home">Apache Zeppelin Wiki</a></li>
+<li><a href="http://stackoverflow.com/questions/tagged/apache-zeppelin">StackOverflow tag <code>apache-zeppelin</code></a></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.6.2/index.html
------------------------------------------------------------------------------
svn:eol-style = native