You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zeppelin.apache.org by ah...@apache.org on 2017/04/17 07:01:50 UTC

svn commit: r1791664 [1/5] - in /zeppelin/site/docs/0.8.0-SNAPSHOT: ./ development/ displaysystem/ install/ interpreter/ manual/ quickstart/ rest-api/ security/ storage/

Author: ahyoungryu
Date: Mon Apr 17 07:01:48 2017
New Revision: 1791664

URL: http://svn.apache.org/viewvc?rev=1791664&view=rev
Log: (empty)

Added:
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html
Modified:
    zeppelin/site/docs/0.8.0-SNAPSHOT/atom.xml
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontribute.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontributewebsite.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelininterpreter.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/displaysystem/back-end-angular.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/displaysystem/basicdisplaysystem.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/displaysystem/front-end-angular.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/index.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/build.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/cdh.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/configuration.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/docker.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/install.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/spark_cluster_mode.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/upgrade.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/virtual_machine.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/install/yarn_install.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/alluxio.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/beam.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/bigquery.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/cassandra.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/elasticsearch.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/flink.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/geode.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/groovy.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/hbase.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/hdfs.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/hive.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/ignite.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/jdbc.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/kylin.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/lens.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/livy.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/mahout.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/markdown.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/pig.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/postgresql.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/python.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/r.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/scalding.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/scio.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/shell.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/interpreter/spark.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/dependencymanagement.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/dynamicform.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/dynamicinterpreterload.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/interpreterexechooks.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/interpreterinstallation.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/interpreters.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/notebookashomepage.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/publish.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/manual/userimpersonation.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/pleasecontribute.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/quickstart/explorezeppelinui.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/quickstart/install_with_flink_and_spark_cluster.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/quickstart/tutorial.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-configuration.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-credential.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-helium.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-interpreter.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-notebook.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rest-api/rest-notebookRepo.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/rss.xml
    zeppelin/site/docs/0.8.0-SNAPSHOT/screenshots.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/search.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/search_data.json
    zeppelin/site/docs/0.8.0-SNAPSHOT/security/authentication.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/security/shiroauthentication.html
    zeppelin/site/docs/0.8.0-SNAPSHOT/sitemap.txt
    zeppelin/site/docs/0.8.0-SNAPSHOT/storage/storage.html

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/atom.xml
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/atom.xml?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/atom.xml (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/atom.xml Mon Apr 17 07:01:48 2017
@@ -4,7 +4,7 @@
  <title>Apache Zeppelin</title>
  <link href="http://zeppelin.apache.org/" rel="self"/>
  <link href="http://zeppelin.apache.org"/>
- <updated>2017-04-04T15:02:14+09:00</updated>
+ <updated>2017-04-17T15:59:29+09:00</updated>
  <id>http://zeppelin.apache.org</id>
  <author>
    <name>The Apache Software Foundation</name>

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontribute.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontribute.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontribute.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontribute.html Mon Apr 17 07:01:48 2017
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontributewebsite.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontributewebsite.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontributewebsite.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/howtocontributewebsite.html Mon Apr 17 07:01:48 2017
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html Mon Apr 17 07:01:48 2017
@@ -3,7 +3,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Application(Experimental)</title>
+    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Application</title>
     <meta name="description" content="Apache Zeppelin Application is a package that runs on Interpreter process and displays it's output inside of the notebook. Make your own Application in Apache Zeppelin is quite easy.">
     <meta name="author" content="The Apache Software Foundation">
 
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
@@ -195,7 +196,7 @@
 
     <div class="content">
       
-<!--<div class="hero-unit Writing a new Application(Experimental)">
+<!--<div class="hero-unit Writing a new Application">
   <h1></h1>
 </div>
 -->
@@ -216,7 +217,7 @@ See the License for the specific languag
 limitations under the License.
 -->
 
-<h1>Writing a new Application (Experimental)</h1>
+<h1>Writing a new Application</h1>
 
 <div id="toc"></div>
 
@@ -274,17 +275,17 @@ limitations under the License.
 
 <p>Package file is a json file that provides information about the application.
 Json file contains the following information</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">{
-  name : &quot;[organization].[name]&quot;,
-  description : &quot;Description&quot;,
-  artifact : &quot;groupId:artifactId:version&quot;,
-  className : &quot;your.package.name.YourApplicationClass&quot;,
-  resources : [
-    [&quot;resource.name&quot;, &quot;:resource.class.name&quot;],
-    [&quot;alternative.resource.name&quot;, &quot;:alternative.class.name&quot;]
-  ],
-  icon : &quot;&lt;i class=&quot;icon&quot;&gt;&lt;/i&gt;&quot;
-}
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;name&quot;</span> <span class="p">:</span> <span class="s2">&quot;[organization].[name]&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Description&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;artifact&quot;</span> <span class="p">:</span> <span class="s2">&quot;groupId:artifactId:version&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;className&quot;</span> <span class="p">:</span> <span class="s2">&quot;your.package.name.YourApplicationClass&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;resources&quot;</span> <span class="p">:</span> <span class="p">[</span>
+    <span class="p">[</span><span class="s2">&quot;resource.name&quot;</span><span class="p">,</span> <span class="s2">&quot;:resource.class.name&quot;</span><span class="p">],</span>
+    <span class="p">[</span><span class="s2">&quot;alternative.resource.name&quot;</span><span class="p">,</span> <span class="s2">&quot;:alternative.class.name&quot;</span><span class="p">]</span>
+  <span class="p">],</span>
+  <span class="nt">&quot;icon&quot;</span> <span class="p">:</span> <span class="s2">&quot;&lt;i class=&#39;icon&#39;&gt;&lt;/i&gt;&quot;</span>
+<span class="p">}</span>
 </code></pre></div>
 <h4>name</h4>
 

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelininterpreter.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelininterpreter.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelininterpreter.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelininterpreter.html Mon Apr 17 07:01:48 2017
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html Mon Apr 17 07:01:48 2017
@@ -3,7 +3,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Spell(Experimental)</title>
+    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Spell</title>
     <meta name="description" content="Spell is a kind of interpreter that runs on browser not on backend. So, technically it's the frontend interpreter. ">
     <meta name="author" content="The Apache Software Foundation">
 
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
@@ -195,7 +196,7 @@
 
     <div class="content">
       
-<!--<div class="hero-unit Writing a new Spell(Experimental)">
+<!--<div class="hero-unit Writing a new Spell">
   <h1></h1>
 </div>
 -->
@@ -216,17 +217,17 @@ See the License for the specific languag
 limitations under the License.
 -->
 
-<h1>Writing a new Spell (Experimental)</h1>
+<h1>Writing a new Spell</h1>
 
 <div id="toc"></div>
 
 <h2>What is Apache Zeppelin Spell</h2>
 
-<p>Spell is a kind of interpreter that runs on browser not on backend. So, technically it&#39;s the frontend interpreter. 
+<p>Spell is a kind of interpreter that runs on browser not on backend. So, technically it&#39;s the frontend interpreter.
 It can provide many benefits.</p>
 
 <ul>
-<li>Spell is pluggable frontend interpreter. So it can be installed and removed easily using helium registry. </li>
+<li>Spell is pluggable frontend interpreter. So it can be installed and removed easily using helium registry.</li>
 <li>Every spell is written in javascript. It means you can use existing javascript libraries whatever you want.</li>
 <li>Spell runs on browser like display system (<code>%html</code>, <code>%table</code>). In other words, every spell can be used as display system as well.</li>
 </ul>
@@ -269,7 +270,7 @@ For example, Use <code>%echo</code> for
 
 <h3>1. Create a npm package</h3>
 
-<p>Create a <a href="https://docs.npmjs.com/files/package.json">package.json</a> in new directory for spell. </p>
+<p>Create a <a href="https://docs.npmjs.com/files/package.json">package.json</a> in new directory for spell.</p>
 
 <ul>
 <li>You have to add a framework called <code>zeppelin-spell</code> as a dependency to create spell (<a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/spell">zeppelin-spell</a>)</li>
@@ -277,24 +278,24 @@ For example, Use <code>%echo</code> for
 </ul>
 
 <p>Here&#39;s an example</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">{
-  &quot;name&quot;: &quot;zeppelin-echo-spell&quot;,
-  &quot;description&quot;: &quot;Zeppelin Echo Spell (example)&quot;,
-  &quot;version&quot;: &quot;1.0.0&quot;,
-  &quot;main&quot;: &quot;index&quot;,
-  &quot;author&quot;: &quot;&quot;,
-  &quot;license&quot;: &quot;Apache-2.0&quot;,
-  &quot;dependencies&quot;: {
-    &quot;zeppelin-spell&quot;: &quot;*&quot;
-  },
-  &quot;helium&quot;: {
-    &quot;icon&quot; : &quot;&lt;i class=&#39;fa fa-repeat&#39;&gt;&lt;/i&gt;&quot;,
-    &quot;spell&quot;: {
-      &quot;magic&quot;: &quot;%echo&quot;,
-      &quot;usage&quot;: &quot;%echo &lt;TEXT&gt;&quot;
-    }
-  }
-}
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;name&quot;</span><span class="p">:</span> <span class="s2">&quot;zeppelin-echo-spell&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span><span class="p">:</span> <span class="s2">&quot;Zeppelin Echo Spell (example)&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;1.0.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;main&quot;</span><span class="p">:</span> <span class="s2">&quot;index&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;author&quot;</span><span class="p">:</span> <span class="s2">&quot;&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span><span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;dependencies&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;zeppelin-spell&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span>
+  <span class="p">},</span>
+  <span class="nt">&quot;helium&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;icon&quot;</span> <span class="p">:</span> <span class="s2">&quot;&lt;i class=&#39;fa fa-repeat&#39;&gt;&lt;/i&gt;&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;spell&quot;</span><span class="p">:</span> <span class="p">{</span>
+      <span class="nt">&quot;magic&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo&quot;</span><span class="p">,</span>
+      <span class="nt">&quot;usage&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo &lt;TEXT&gt;&quot;</span>
+    <span class="p">}</span>
+  <span class="p">}</span>
+<span class="p">}</span>
 </code></pre></div>
 <h3>2. Write spell using framework</h3>
 
@@ -308,7 +309,7 @@ For example, Use <code>%echo</code> for
 </ul>
 
 <p>Now, you need to write code to create spell which processing text.</p>
-<div class="highlight"><pre><code class="javascript language-javascript" data-lang="javascript"><span class="kr">import</span> <span class="p">{</span>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="kr">import</span> <span class="p">{</span>
     <span class="nx">SpellBase</span><span class="p">,</span>
     <span class="nx">SpellResult</span><span class="p">,</span>
     <span class="nx">DefaultDisplayType</span><span class="p">,</span>
@@ -323,7 +324,7 @@ For example, Use <code>%echo</code> for
     <span class="nx">interpret</span><span class="p">(</span><span class="nx">paragraphText</span><span class="p">)</span> <span class="p">{</span>
         <span class="kr">const</span> <span class="nx">processed</span> <span class="o">=</span> <span class="nx">paragraphText</span> <span class="o">+</span> <span class="s1">&#39;!&#39;</span><span class="p">;</span>
 
-        <span class="cm">/** </span>
+        <span class="cm">/**</span>
 <span class="cm">         * should return `SpellResult` which including `data` and `type`</span>
 <span class="cm">         * default type is `TEXT` if you don&#39;t specify.  </span>
 <span class="cm">         */</span>
@@ -332,14 +333,14 @@ For example, Use <code>%echo</code> for
 <span class="p">}</span>
 </code></pre></div>
 <p>Here is another example. Let&#39;s say we want to create markdown spell. First of all, we should add a dependency for markdown in package.json</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">// package.json
- &quot;dependencies&quot;: {
-    &quot;markdown&quot;: &quot;0.5.0&quot;,
-    &quot;zeppelin-spell&quot;: &quot;*&quot;
-  },
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="err">//</span> <span class="err">package.json</span>
+ <span class="s2">&quot;dependencies&quot;</span><span class="err">:</span> <span class="p">{</span>
+    <span class="nt">&quot;markdown&quot;</span><span class="p">:</span> <span class="s2">&quot;0.5.0&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;zeppelin-spell&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span>
+  <span class="p">}</span><span class="err">,</span>
 </code></pre></div>
 <p>And here is spell code.</p>
-<div class="highlight"><pre><code class="javascript language-javascript" data-lang="javascript"><span class="kr">import</span> <span class="p">{</span>
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="kr">import</span> <span class="p">{</span>
     <span class="nx">SpellBase</span><span class="p">,</span>
     <span class="nx">SpellResult</span><span class="p">,</span>
     <span class="nx">DefaultDisplayType</span><span class="p">,</span>
@@ -366,38 +367,38 @@ For example, Use <code>%echo</code> for
 <span class="p">}</span>
 </code></pre></div>
 <ul>
-<li>You might want to manipulate DOM directly (e.g google d3.js), then refer <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-flowchart/index.js">Flowchart Spell</a> </li>
+<li>You might want to manipulate DOM directly (e.g google d3.js), then refer <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-flowchart/index.js">Flowchart Spell</a></li>
 <li>You might want to return promise not string (e.g API call), then refer <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-examples/zeppelin-example-spell-translator/index.js">Google Translation API Spell</a></li>
 </ul>
 
 <h3>3. Create <strong>Helium package file</strong> for local deployment</h3>
 
 <p>You don&#39;t want to publish your package every time you make a change in your spell. Zeppelin provides local deploy.
-The only thing you need to do is creating a <strong>Helium Package file</strong> (JSON) for local deploy. 
+The only thing you need to do is creating a <strong>Helium Package file</strong> (JSON) for local deploy.
 It&#39;s automatically created when you publish to npm repository but in local case, you should make it by yourself.</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">{
-  &quot;type&quot; : &quot;SPELL&quot;,
-  &quot;name&quot; : &quot;zeppelin-echo-spell&quot;,
-  &quot;version&quot;: &quot;1.0.0&quot;,
-  &quot;description&quot; : &quot;Return just what receive (example)&quot;,
-  &quot;artifact&quot; : &quot;./zeppelin-examples/zeppelin-example-spell-echo&quot;,
-  &quot;license&quot; : &quot;Apache-2.0&quot;,
-  &quot;spell&quot;: {
-    &quot;magic&quot;: &quot;%echo&quot;,
-    &quot;usage&quot;: &quot;%echo &lt;TEXT&gt;&quot;
-  }
-}
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;type&quot;</span> <span class="p">:</span> <span class="s2">&quot;SPELL&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;name&quot;</span> <span class="p">:</span> <span class="s2">&quot;zeppelin-echo-spell&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;1.0.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Return just what receive (example)&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;artifact&quot;</span> <span class="p">:</span> <span class="s2">&quot;./zeppelin-examples/zeppelin-example-spell-echo&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span> <span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;spell&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;magic&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;usage&quot;</span><span class="p">:</span> <span class="s2">&quot;%echo &lt;TEXT&gt;&quot;</span>
+  <span class="p">}</span>
+<span class="p">}</span>
 </code></pre></div>
 <ul>
 <li>Place this file in your local registry directory (default <code>$ZEPPELIN_HOME/helium</code>).</li>
 <li><code>type</code> should be <code>SPELL</code></li>
-<li>Make sure that <code>artifact</code> should be same as your spell directory. </li>
+<li>Make sure that <code>artifact</code> should be same as your spell directory.</li>
 <li>You can get information about other fields in <a href="./writingzeppelinvisualization.html#3-create-helium-package-file-and-locally-deploy">Helium Visualization#3-create-helium-package-file-and-locally-deploy</a>.</li>
 </ul>
 
 <h3>4. Run in dev mode</h3>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">cd zeppelin-web
-yarn run dev:helium 
+<div class="highlight"><pre><code class="bash language-bash" data-lang="bash"><span class="nb">cd </span>zeppelin-web
+yarn run dev:helium
 </code></pre></div>
 <p>You can browse localhost:9000. Every time refresh your browser, Zeppelin will rebuild your spell and reload changes.</p>
 

Modified: zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html
URL: http://svn.apache.org/viewvc/zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html?rev=1791664&r1=1791663&r2=1791664&view=diff
==============================================================================
--- zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html (original)
+++ zeppelin/site/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html Mon Apr 17 07:01:48 2017
@@ -3,7 +3,7 @@
 <html lang="en">
   <head>
     <meta charset="utf-8">
-    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Visualization(Experimental)</title>
+    <title>Apache Zeppelin 0.8.0-SNAPSHOT Documentation: Writing a new Visualization</title>
     <meta name="description" content="Apache Zeppelin Visualization is a pluggable package that can be loaded/unloaded on runtime through Helium framework in Zeppelin. A Visualization is a javascript npm package and user can use them just like any other built-in visualization in a note.">
     <meta name="author" content="The Apache Software Foundation">
 
@@ -164,10 +164,11 @@
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/notebook_authorization.html">Notebook Authorization</a></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/security/datasource_authorization.html">Data Source Authorization</a></li>
                 <li role="separator" class="divider"></li>
-                <li class="title"><span><b>Helium Framework</b><span></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell (Experimental)</a></li>
-                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization (Experimental)</a></li>
+                <li class="title"><span><b>Helium Framework (Experimental)</b></span></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinapplication.html">Writing Zeppelin Application</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinspell.html">Writing Zeppelin Spell</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization.html">Writing Zeppelin Visualization: Basics</a></li>
+                <li><a href="/docs/0.8.0-SNAPSHOT/development/writingzeppelinvisualization_transformation.html">Writing Zeppelin Visualization: Transformation</a></li>
                 <li role="separator" class="divider"></li>
                 <li class="title"><span><b>Advanced</b><span></li>
                 <li><a href="/docs/0.8.0-SNAPSHOT/install/virtual_machine.html">Zeppelin on Vagrant VM</a></li>
@@ -195,7 +196,7 @@
 
     <div class="content">
       
-<!--<div class="hero-unit Writing a new Visualization(Experimental)">
+<!--<div class="hero-unit Writing a new Visualization">
   <h1></h1>
 </div>
 -->
@@ -216,7 +217,7 @@ See the License for the specific languag
 limitations under the License.
 -->
 
-<h1>Writing a new Visualization (Experimental)</h1>
+<h1>Writing a new Visualization</h1>
 
 <div id="toc"></div>
 
@@ -254,44 +255,44 @@ User can use just like any other built-i
 
 <h4>1. Create a npm package</h4>
 
-<p>Create a <a href="https://docs.npmjs.com/files/package.json">package.json</a> in your new Visualization directory. Normally, you can add any dependencies in package.json however Zeppelin Visualization package only allows two dependencies: <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization">zeppelin-vis</a> and <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/tabledata">zeppelin-tabledata</a>.</p>
+<p>Create a <a href="https://docs.npmjs.com/files/package.json">package.json</a> in your new Visualization directory. You can add any dependencies in package.json, but you <strong>must include two dependencies: <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization">zeppelin-vis</a> and <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/tabledata">zeppelin-tabledata</a>.</strong></p>
 
 <p>Here&#39;s an example</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">{
-  &quot;name&quot;: &quot;zeppelin_horizontalbar&quot;,
-  &quot;description&quot; : &quot;Horizontal Bar chart&quot;,
-  &quot;version&quot;: &quot;1.0.0&quot;,
-  &quot;main&quot;: &quot;horizontalbar&quot;,
-  &quot;author&quot;: &quot;&quot;,
-  &quot;license&quot;: &quot;Apache-2.0&quot;,
-  &quot;dependencies&quot;: {
-    &quot;zeppelin-tabledata&quot;: &quot;*&quot;,
-    &quot;zeppelin-vis&quot;: &quot;*&quot;
-  }
-}
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;name&quot;</span><span class="p">:</span> <span class="s2">&quot;zeppelin_horizontalbar&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Horizontal Bar chart&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;version&quot;</span><span class="p">:</span> <span class="s2">&quot;1.0.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;main&quot;</span><span class="p">:</span> <span class="s2">&quot;horizontalbar&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;author&quot;</span><span class="p">:</span> <span class="s2">&quot;&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span><span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;dependencies&quot;</span><span class="p">:</span> <span class="p">{</span>
+    <span class="nt">&quot;zeppelin-tabledata&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span><span class="p">,</span>
+    <span class="nt">&quot;zeppelin-vis&quot;</span><span class="p">:</span> <span class="s2">&quot;*&quot;</span>
+  <span class="p">}</span>
+<span class="p">}</span>
 </code></pre></div>
 <h4>2. Create your own visualization</h4>
 
 <p>To create your own visualization, you need to create a js file and import <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/app/visualization/visualization.js">Visualization</a> class from <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/visualization">zeppelin-vis</a> package and extend the class. <a href="https://github.com/apache/zeppelin/tree/master/zeppelin-web/src/app/tabledata">zeppelin-tabledata</a> package provides some useful transformations, like pivot, you can use in your visualization. (you can create your own transformation, too).</p>
 
 <p><a href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/app/visualization/visualization.js">Visualization</a> class, there&#39;re several methods that you need to override and implement. Here&#39;s simple visualization that just prints <code>Hello world</code>.</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">import Visualization from &#39;zeppelin-vis&#39;
-import PassthroughTransformation from &#39;zeppelin-tabledata/passthrough&#39;
+<div class="highlight"><pre><code class="js language-js" data-lang="js"><span class="kr">import</span> <span class="nx">Visualization</span> <span class="nx">from</span> <span class="s1">&#39;zeppelin-vis&#39;</span>
+<span class="kr">import</span> <span class="nx">PassthroughTransformation</span> <span class="nx">from</span> <span class="s1">&#39;zeppelin-tabledata/passthrough&#39;</span>
 
-export default class helloworld extends Visualization {
-  constructor(targetEl, config) {
-    super(targetEl, config)
-    this.passthrough = new PassthroughTransformation(config);
-  }
-
-  render(tableData) {
-    this.targetEl.html(&#39;Hello world!&#39;)
-  }
-
-  getTransformation() {
-    return this.passthrough
-  }
-}
+<span class="kr">export</span> <span class="k">default</span> <span class="kr">class</span> <span class="nx">helloworld</span> <span class="kr">extends</span> <span class="nx">Visualization</span> <span class="p">{</span>
+  <span class="nx">constructor</span><span class="p">(</span><span class="nx">targetEl</span><span class="p">,</span> <span class="nx">config</span><span class="p">)</span> <span class="p">{</span>
+    <span class="kr">super</span><span class="p">(</span><span class="nx">targetEl</span><span class="p">,</span> <span class="nx">config</span><span class="p">)</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">passthrough</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">PassthroughTransformation</span><span class="p">(</span><span class="nx">config</span><span class="p">);</span>
+  <span class="p">}</span>
+
+  <span class="nx">render</span><span class="p">(</span><span class="nx">tableData</span><span class="p">)</span> <span class="p">{</span>
+    <span class="k">this</span><span class="p">.</span><span class="nx">targetEl</span><span class="p">.</span><span class="nx">html</span><span class="p">(</span><span class="s1">&#39;Hello world!&#39;</span><span class="p">)</span>
+  <span class="p">}</span>
+
+  <span class="nx">getTransformation</span><span class="p">()</span> <span class="p">{</span>
+    <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">passthrough</span>
+  <span class="p">}</span>
+<span class="p">}</span>
 </code></pre></div>
 <p>To learn more about <code>Visualization</code> class, check <a href="https://github.com/apache/zeppelin/blob/master/zeppelin-web/src/app/visualization/visualization.js">visualization.js</a>.</p>
 
@@ -303,14 +304,14 @@ export default class helloworld extends
 
 <p><strong>Helium Package file</strong> is a json file that provides information about the application.
 Json file contains the following information</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">{
-  &quot;type&quot; : &quot;VISUALIZATION&quot;,
-  &quot;name&quot; : &quot;zeppelin_horizontalbar&quot;,
-  &quot;description&quot; : &quot;Horizontal Bar chart (example)&quot;,
-  &quot;license&quot; : &quot;Apache-2.0&quot;,
-  &quot;artifact&quot; : &quot;./zeppelin-examples/zeppelin-example-horizontalbar&quot;,
-  &quot;icon&quot; : &quot;&lt;i class=&#39;fa fa-bar-chart rotate90flipX&#39;&gt;&lt;/i&gt;&quot;
-}
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="p">{</span>
+  <span class="nt">&quot;type&quot;</span> <span class="p">:</span> <span class="s2">&quot;VISUALIZATION&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;name&quot;</span> <span class="p">:</span> <span class="s2">&quot;zeppelin_horizontalbar&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;description&quot;</span> <span class="p">:</span> <span class="s2">&quot;Horizontal Bar chart (example)&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;license&quot;</span> <span class="p">:</span> <span class="s2">&quot;Apache-2.0&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;artifact&quot;</span> <span class="p">:</span> <span class="s2">&quot;./zeppelin-examples/zeppelin-example-horizontalbar&quot;</span><span class="p">,</span>
+  <span class="nt">&quot;icon&quot;</span> <span class="p">:</span> <span class="s2">&quot;&lt;i class=&#39;fa fa-bar-chart rotate90flipX&#39;&gt;&lt;/i&gt;&quot;</span>
+<span class="p">}</span>
 </code></pre></div>
 <p>Place this file in your local registry directory (default <code>./helium</code>).</p>
 
@@ -334,31 +335,31 @@ Check <a href="./writingzeppelinapplicat
 <p>e.g.</p>
 
 <p>When artifact exists in npm repository</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">artifact: &quot;my-visualiztion@1.0.0&quot;
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="s2">&quot;artifact&quot;</span><span class="err">:</span> <span class="s2">&quot;my-visualiztion@1.0.0&quot;</span>
 </code></pre></div>
 <p>When artifact exists in local file system</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">artifact: &quot;/path/to/my/visualization&quot;
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="s2">&quot;artifact&quot;</span><span class="err">:</span> <span class="s2">&quot;/path/to/my/visualization&quot;</span>
 </code></pre></div>
 <h5>license</h5>
 
 <p>License information.</p>
 
 <p>e.g.</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">license: &quot;Apache-2.0&quot;
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="s2">&quot;license&quot;</span><span class="err">:</span> <span class="s2">&quot;Apache-2.0&quot;</span>
 </code></pre></div>
 <h5>icon</h5>
 
 <p>Icon to be used in visualization select button. String in this field will be rendered as a HTML tag.</p>
 
 <p>e.g.</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">icon: &quot;&lt;i class=&#39;fa fa-coffee&#39;&gt;&lt;/i&gt;&quot;
+<div class="highlight"><pre><code class="json language-json" data-lang="json"><span class="s2">&quot;icon&quot;</span><span class="err">:</span> <span class="s2">&quot;&lt;i class=&#39;fa fa-coffee&#39;&gt;&lt;/i&gt;&quot;</span>
 </code></pre></div>
 <h4>4. Run in dev mode</h4>
 
 <p>Place your <strong>Helium package file</strong> in local registry (ZEPPELIN_HOME/helium).
 Run Zeppelin. And then run zeppelin-web in visualization dev mode.</p>
-<div class="highlight"><pre><code class="text language-text" data-lang="text">cd zeppelin-web
-yarn run dev:helium 
+<div class="highlight"><pre><code class="bash language-bash" data-lang="bash"><span class="nb">cd </span>zeppelin-web
+yarn run dev:helium
 </code></pre></div>
 <p>You can browse localhost:9000. Everytime refresh your browser, Zeppelin will rebuild your visualization and reload changes.</p>